js提取html字符串的文本(去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

炫技式提取(完全自娱自乐思维)(灵活)

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

  • 2
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
你可以使用正则表达式或者 DOM 操作来将 HTML 字符串划分为数组。以下是使用正则表达式的示例代码: ```javascript function splitHTMLString(htmlString) { // 匹配 HTML 标签的正则表达式 var tagRegex = /<[^>]+>/g; // 使用正则表达式将 HTML 字符串划分为数组 var htmlArray = htmlString.split(tagRegex); // 过滤掉空字符串 htmlArray = htmlArray.filter(function(item) { return item.trim() !== ''; }); return htmlArray; } // 使用示例 var htmlString = '<div><p>Hello</p><p>World</p></div>'; var result = splitHTMLString(htmlString); console.log(result); // 输出: ["Hello", "World"] ``` 在上述代码中,我们使用正则表达式 `<[^>]+>` 来匹配 HTML 标签,并使用 `split()` 方法将 HTML 字符串划分为数组。然后,我们使用 `filter()` 方法过滤掉空字符串,最后返回划分后的数组。 另外,如果你希望保留 HTML 标签,而只是划分其中的文本内容,你可以使用 DOM 操作来实现。以下是一个使用 DOM 操作的示例代码: ```javascript function splitHTMLString(htmlString) { // 创建一个临时的 div 元素 var tempDiv = document.createElement('div'); // 将 HTML 字符串赋值给 div 的 innerHTML 属性 tempDiv.innerHTML = htmlString; // 获取 div 中的所有文本节点 var textNodes = Array.from(tempDiv.childNodes).filter(function(node) { return node.nodeType === Node.TEXT_NODE; }); // 提取文本节点的内容并返回数组 var htmlArray = textNodes.map(function(node) { return node.nodeValue.trim(); }); return htmlArray; } // 使用示例 var htmlString = '<div><p>Hello</p><p>World</p></div>'; var result = splitHTMLString(htmlString); console.log(result); // 输出: ["Hello", "World"] ``` 在上述代码中,我们创建了一个临时的 div 元素,并将 HTML 字符串赋值给它的 innerHTML 属性。然后,我们通过访问 div 的 childNodes 属性,筛选出其中的文本节点,并提取这些文本节点的内容,最终返回划分后的数组。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值