js提取html字符串的文本方法总结(去html标签)

7,545 阅读1分钟

一、js进阶正则表达式实现过滤HTML标签

html_str = “1234567891011121314151617181920” 正则提取(正常思维)

`var re = new RegExp('<[^<>]+>','g');
var text = html_str.replace(re ,"");
//或
var text = html_str.replace(/<[^<>]+>/g,"");
console.log(text);
//输出 1234567891011121314151617181920`

注意 1、全局匹配g肯定不能忘记写 2、<>标签中不能包含标签实现过滤HTML标签

保留某些标签的写法

js 正则表达式去除html字符中所有的标签(img标签除外) description.replace(/<(?!img).*?>/g, "");

如果保留img,p标签,则为: description.replace(/<(?!img|p|/p).*?>/g, "");

在js中/需要用转义字符。

js处理去除HTML tag加行尾空白

/移除HTML标签代码/ function removeHTMLTag(str) { str = str.replace(/</?[^>]>/g,''); //去除HTML tag str = str.replace(/[ | ]\n/g,'\n'); //去除行尾空白 //str = str.replace(/\n[\s| | ]*\r/g,'\n'); //去除多余空行 str=str.replace(/ /ig,'');//去掉 return str; } //转意符换成普通字符 function escape2Html(str) { var arrEntities={'lt':'<','gt':'>','nbsp':' ','amp':'&','quot':'"'}; return str.replace(/&(lt|gt|nbsp|amp|quot);/ig,function(all,t){return arrEntities[t];}); }

二、用dom炫技式提取(完全自娱自乐思维)

var oDiv = document.createElement(‘div’);
oDiv.innerHTML = html_str;
var text = oDiv.innerText;
console.log(text);
//输出 1234567891011121314151617181920
//比起正则这个更加灵活的可以直接操作/提取某一个标签的任何东西
//获取子节点的个数
console.log(oDiv.childNodes.length) //输出 20
//获取第11个子节点的innerHTML
console.log(oDiv.childNodes[10].innerHTML) //输出 11