我如何删除除特定标签以外的所有标签的属性？ [英] How can I remove all tag's attributes except specific ones?

问题描述

我有这个字符串：

  var str ='< p>段落< a>链接< / a>< ; / p为H. 
< div class =myclass> 
< div>东西< / div> 
< div style =mystyle> something< / div> 
< b>< a href =＃>连结< / a>< / b> 
< b>< a href =＃name =a name> link< / a>< / b> 
< b style =color：red>粗体< / b> 
< img src =../ pathalt =something/> 
< img src =../ pathalt =somethingclass =myclass/> 
< / div>'; 
  

我想要除去 href ， src ， alt 。所以这是预期的结果：

  / * 
< p>段落< a>链接< / a><<< ; / p为H. 
< div> 
< div>东西< / div> 
< div>东西< / div> 
< b>< a href =＃>连结< / a>< / b> 
< b>< a href =＃>连结< / a>< / b> 
< b>粗体< / b> 
< img src =../ pathalt =something> 
< img src =../ pathalt =something> 
< / div> 
  

我该怎么做？

---

我可以选择一些没用的：

/ <[az] +。*？（href | src | alt）=[^] +/ g

解决方案

var str =`< p>段落< a>链接< / a>< / p>< div class =myclass>< div>东西< / div>< div style =mystyle >东西< / div>< b>< a href =＃>链接< / a>< / b>< b>< a href =＃name =a name > link< / a>< / b>< b style =color：red> bold< / b>< img src =../ pathalt =something/><一世mg src =../ pathalt =somethingclass =myclass/> < / div>`; var div = document.createElement（div）; div.innerHTML = str; div.querySelectorAll（*）。forEach（function（el）{for（var i = 0，atts = el.attributes，n = atts.length; i< n; i ++）{var att = atts [i] .nodeName; if（[src，alt，href]。indexOf（att）== -1）el.removeAttribute（att）;}}）; // console.log（div）; alert：显示它更清晰（div.innerHTML）;

请注意，您需要反引号引用嵌入换行符的字符串

I have this string:

var str = '<p>paragraph<a>link</a></p>
           <div class="myclass">
               <div>something</div>
               <div style="mystyle">something</div>
               <b><a href="#">link</a></b>
               <b><a href="#" name="a name">link</a></b>
               <b style="color:red">bold</b>
               <img src="../path" alt="something" />
               <img src="../path" alt="something" class="myclass" />
           </div>';

I want to remove all attributes except href, src, alt. So this is expected result:

/* 
<p>paragraph<a>link</a></p>
<div>
    <div>something</div>
    <div>something</div>
    <b><a href="#">link</a></b>
    <b><a href="#">link</a></b>
    <b>bold</b>
    <img src="../path" alt="something">
    <img src="../path" alt="something">
</div>

How can I do that?

---

I can just select them which isn't useful:

/<[a-z]+ .*?(href|src|alt)="[^"]+"/g

解决方案

var str = `<p>paragraph<a>link</a></p>
           <div class="myclass">
               <div>something</div>
               <div style="mystyle">something</div>
               <b><a href="#">link</a></b>
               <b><a href="#" name="a name">link</a></b>
               <b style="color:red">bold</b>
               <img src="../path" alt="something" />
               <img src="../path" alt="something" class="myclass" />
           </div>`;
var div = document.createElement("div");
div.innerHTML=str;
div.querySelectorAll("*").forEach(function(el){
  for (var i = 0, atts = el.attributes, n = atts.length; i < n; i++){
    var att = atts[i].nodeName;
    if (["src","alt","href"].indexOf(att) ==-1) el.removeAttribute(att); 
  }
}); 
// console.log(div); alert shows it more clearly
alert(div.innerHTML);

PS: Please note that you need backticks to quote a string with embedded newlines

这篇关于我如何删除除特定标签以外的所有标签的属性？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！