javascript - 删除除 img 标签之外的所有标签

Question

我需要一个正则表达式或其他东西来删除 a 中的所有标签contentEditable div，但要保留img特定的标签classor id，我该怎么做？

现在我使用：

.replace(/(<\/?.*?>)/gi, '');

但它会删除所有标签。

我做的 ：

var element = document.getElementById("myDiv").children;
   for(var i=0; i<element .length;i++)
   {
     if(element[i].tagName != "IMG" || element[i].className != "requiredClassName")
     {
       element[i].parentNode.removeChild(element[i]);
     }
   }

Answer 1

（如果您需要纯 JS）：也许更好的方法是收集所有元素，然后检查它们的类/ID 并执行操作。好主意是使用 DOM，而不是正则表达式。DOM 用于 HTML 元素操作。

（或使用 jQuery）：简单的代码就可以做到这一点。只需收集所有 div 的孩子并在 .each() 循环中检查他们的班级；

例如：

$('#contentEditable').each( function( index ) {
    if( !this.is( 'img' ) && ( this.is('.someclass') || this.is('#someid') ) ) {
        this.remove();
    }
});

希望它可以帮助你。

PS：使用贪心量化时要小心.*

它将获取 any 之间的所有文本< >，因此如果您有下面列出的代码，regexp(<\/?.*?>)将收集整个代码。

<div class="container">
    <div id="header">
        <div id="portalLink">
            <a class="genu" href="http://stackexchange.com">Stack Exchange</a>
        </div>
    </div>
</div>

Answer 2

var child=document.getElementById('editableDIV').firstChild;
while(child) {
  var removeNode=null;
  if(child.tagName&&(child.tagName.toUpperCase()!=='IMG'||
     child.id!=='myid'||
     child.className!=='myclass')) removeNode=child;
  child=child.nextSibling;
  if(removeNode)removeNode.parentNode.removeChild(removeNode);
}

Answer 3

var editableDiv = document.getElementById("MyEditableDiv")
var editableDivImgs = editableDiv.getElementsByTagName("img")
for (var i = 0; i < editableDivImgs.length; i++) {
    if(editableDivImgs[i].className != "safe")
    {
        editableDivImgs[i].parentNode.removeChild(editableDivImgs[i])
    }
}

你有没有尝试过这样的事情？

Answer 4

不是删除所有其他元素，而是提取所有 img 并将它们连接成一个新字符串：

var regex = /<img.*?>/gmi;
var imgsOnly = '';
var img;
while( ( img = regex.exec(str) ) !== null ) {
    imgsOnly += img;
}
alert( imgsOnly );