过滤html标签

最新推荐文章于 2025-08-18 13:22:36 发布

原创最新推荐文章于 2025-08-18 13:22:36 发布 · 1.5k 阅读

1 ·

本内容遵循CC 4.0 BY-SA版权协议

标签

#js

玩转js 专栏收录该内容

4 篇文章

订阅专栏

本文介绍三种函数，分别用于过滤HTML中的标签、特定标签和所有标签。第一种只保留非'a'标签，第二种保留非'div'和'br'标签，第三种移除所有标签，展示了在不同场景下如何精细化处理HTML内容。

开发板推荐：天空星STM32F407VET6开发板

超高性价比 STM32主控 | 超高主频 | 一板兼容百芯 | 比赛神器 | 沉金彩色丝印

点击查看

情况一：过滤掉某个标签。

//自闭合标签，包含属性的情况
function retainLinkA(htmlStr){
    // var filterStr = htmlStr;
    console.log(htmlStr.replace(/<br\/.*?>/ig,""))
}
retainLinkA("<div>aaa</div><br/><p>bbb</p><a href='http://www.baidu.cn'>ddd</a>aaaadada")
//配对标签，包含属性的情况
function retainLinkA(htmlStr){
    // var filterStr = htmlStr;
    console.log(htmlStr.replace(/<(div|\/div).*?>/ig,""))
}
retainLinkA("<div>aaa</div><br/><p>bbb</p><a href='http://www.baidu.cn'>ddd</a>aaaadada")

情况二：除了某个标签，过滤掉其他的

//配对标签
function retainLinkA(htmlStr){
    // var filterStr = htmlStr;
    console.log(htmlStr.replace(/<(?!a|\/a).*?>/ig,""))
}
retainLinkA("<div>aaa</div><br/><p>bbb</p><a href='http://www.baidu.cn'>ddd</a>aaaadada")
//单个标签
function retainLinkA(htmlStr){
    // var filterStr = htmlStr;
    console.log(htmlStr.replace(/<?!br\/.*?>/ig,""))
}
retainLinkA("<div>aaa</div><br/><p>bbb</p><a href='http://www.baidu.cn'>ddd</a>aaaadada")

情况三：过滤掉所有标签

function retainLinkA(htmlStr){
    // var filterStr = htmlStr;
    // console.log(htmlStr.replace(/<(?!a|\/a).*?>/ig,""))
    console.log(htmlStr.replace(/<.*?>/ig,""))
}
retainLinkA("<div>aaa</div><br/><p>bbb</p><a href='http://www.baidu.cn'>ddd</a>aaaadada")

开发板推荐：天空星STM32F407VET6开发板

超高性价比 STM32主控 | 超高主频 | 一板兼容百芯 | 比赛神器 | 沉金彩色丝印

点击查看