在javascript中更改outerHTML

Question

$(editor[i])[0].outerHTML的值为：

 <p style="color: red;" data-mce-style="color: red;">some string</p>

我想让data-mce-style="color: red;"消失。

我是这样做的：

$(editor[i])[0].outerHTML.replace('data-mce-style="color: red;"', '');

但这并不能取代它。

Answer 1

.replace会创建一个新的转换后的字符串；它不会更改原始变量。您只需创建一个新字符串，而不是将新字符串存储回outerHTML，如下所示：

$(editor[i])[0].outerHTML = $(editor[i])[0].outerHTML.replace('data-mce-style="color: red;"', '');

然而，这只解决了您当前的问题--有更好的方法来完成所需的任务，而不是对<p>元素进行字符串化和重新解析。由于您使用的是jQuery，因此最明显的方法是使用removeAttr方法：

$(editor[i]).removeAttr('data-mce-style')​;​

Answer 2

尝试：

$(editor[i]).removeAttr('data-mce-style')

http://api.jquery.com/removeAttr/

当然，这将适用于选择器中的所有元素。如果您只想将其应用于元素0，则使用：

$(editor[i]).first().removeAttr('data-mce-style')

Answer 3

element.setAttribute(attr, null)或element.removeAttribute

不需要outerHTML和replace。请注意，替换HTML将删除事件侦听器(属性事件处理程序除外)。