关于对UEditor富文本框所获取的数据做“筛选”处理

来源：互联网发布：软启动器编程编辑：程序博客网时间：2024/05/18 00:49

之前写东西的时候碰到一个问题，大致是从后台的富文本框获取新闻的内容展示出来，具体分为简介页和详情页，但是简介页不能出现图片。那我们获取的数据是一样的，如何在简介页将图片筛掉呢？我开始想了一种方法，就是在简介页获取数据的时候，直接把<img>标签给删除掉，然而仔细想了下后觉得并不好，因为这样意味着要删除标签所有的内容，然而我们并不知道这个标签具体有多长，无法用分割字符串来解决。后来想到了display：none 我们只要在用js的字符串方法识别到'<img' 这样的字符串，然后在其后面添加display：none 这样就可以把所有的img标签都筛掉了。我们来举个例子：
举例子之前，我们来看看2个字符串方法
1 :str.indexOf(searchStr,searchStart)
第一个参数是所要寻找的字符串的值，第二个是开始寻找的位置，如果没有寻找到对应的字符串，则返回-1
2 str.substring(start,stop）
前后两个参数的意义是开始和停止寻找的位置

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>Document</title></head><body><div class="box">  </div>    <script src='https://cdn.bootcss.com/jquery/3.2.1/jquery.js'></script>    <script>//str为整段字符串，subStr为要寻找的字符串function searchSubStr(str,subStr){//第二个参数为0，则从0位置开始寻找，pos的值为找到第一个str的位置    var pos = str.indexOf(subStr);//因为如果找不到，str.indexOf()这个方法就会返回-1，所以我们有while循环来限定    while(pos>-1){//把每个str的位置存到数组里    positions.push(pos);    pos = str.indexOf(subStr,pos+1);    }    console.log(pos) // 返回存有str位置的数组    return positions}function insert_flg(str,flg,sn){    var newstr=""; // 把一整段字符串分为两断        var tmp=str.substring(0, sn);        var tmp1=str.substring(sn);  //在其中间插入 “style="display:none”            newstr+=tmp+flg+tmp1;    return newstr;}var str = "<div>今天早上去买菜"+"<img src='123.png'>"+"</div>";//测试代码var positions = new Array();var posi=searchSubStr(str,"<img")var flg=' style="display:none" ';console.log(posi)for(var i=0;i<posi.length;i++){    console.log(posi.length)    //因为每次插入flg，整段字符串都会变长，而且“<img”的位置也会变化，sn的值也要随之变化。    str=insert_flg(str,flg,posi[i]+5+(i*20))}//测试代码$(".box").append(str)console.log(str)    </script></body></html>

这里写图片描述这是注释掉测试代码的结果
这是有测试代码的结果

阅读全文

1 0