contentEditable div 只允许 TEXT 和 IMG 标签

发布于 2024-12-04 16:14:53 字数 885 浏览 1 评论 0原文

如果我有一个 contentEditable div,我可以删除除具有特定类的 IMG 之外的所有 HTML 元素吗?我问了一个问题,但我对此有麻烦。问题在于 Google Chrome 使用 div 作为换行符/分隔符,Internet Explorer 使用 p,而 Mozilla Firefox 仅使用
>。

如何从 contentEditable div 中删除除图像之外的所有 HTML 元素,并为所有浏览器保留行?

我用过 :

   var element = document.getElementById("myDiv");
   for(var i=0; i<element.children.length;i++)
   {
     if(element.children[i].tagName != "IMG" || 
        element.children[i].className != "requiredClassName")
     {
       element.insertBefore(document.createTextNode(element.children[i].innerHTML.replace(/<\/?.*?\/?>/gi, ''), element.children[i]);
       element.children[i].parentNode.removeChild(element.children[i]);
     }
   }

但它在 IE 和 Chrome 中会引起麻烦,它会删除所有行,并且所有文本都变成一长行。

我只需要纯 JavaScript 代码。

If I have an contentEditable div can I remove all HTML elements except for IMG with specific class. I asked a question about that, but I have troubles with it. The problem is that Google Chrome uses divs as lines break / separator, Internet Explorer uses p, and the Mozilla Firefox uses only <br>.

How can I remove all HTML elements Except for Images from the contentEditable div, and keep lines, for all browsers?

I used :

   var element = document.getElementById("myDiv");
   for(var i=0; i<element.children.length;i++)
   {
     if(element.children[i].tagName != "IMG" || 
        element.children[i].className != "requiredClassName")
     {
       element.insertBefore(document.createTextNode(element.children[i].innerHTML.replace(/<\/?.*?\/?>/gi, ''), element.children[i]);
       element.children[i].parentNode.removeChild(element.children[i]);
     }
   }

But it causes troubles in IE and Chrome, it removes all lines, and all text became in one long line.

I need only pure JavaScript code.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
列表为空,暂无数据
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文