javascript - jQuery 在 Internet Explorer 8 的 HTML 标签中插入 nodeIndex 属性

Question

我们在我工作的网站上使用 jQuery 1.5.1。我最近在 Internet Explorer 8 中发现我的 HTML 有问题

问题是“nodeIndex”属性被插入到 DOM 中，大概是由 jQuery 插入的(请参阅下面的另一个 StackOverflow 问题，其中提到了 nodeIndex)。这些属性不在页面源代码中——只在 DOM 中，然后使用 IE8(很棒的)开发人员工具检查它。

IE8 中的 DOM:

<DIV nodeIndex="4">
  <B nodeIndex="1">bold</B>
  <BR nodeIndex="2">
  <I nodeIndex="3">italics</I>
  <BR nodeIndex="4">
  <U nodeIndex="5">underline</U>
  <BR nodeIndex="6">
</DIV>

FF5(和 Chrome 12)中的 DOM:

<div>
  <b>bold</b>
  <br>
  <i>italics</i>
  <br>
  <u>underline</u>
  <br>
</div>

问题是 DIV 是论坛帖子的文本。如果用户想引用论坛帖子，帖子的 html 将被转换成 BBCode(因为旧的论坛帖子使用 BBCode 标记进行标记)，保持格式标记，并复制到用户写入的文本区域新论坛帖子的文本(包括引用的文本)。

使用 JavaScript/jQuery 可以很简单地用相应的 BBCode 标签替换 html 标签，但是添加 nodeIndex 属性使得有必要添加 nodeIndex 属性的正则表达式替换，这看起来像是一个丑陋的 hack。

谁能告诉我为什么在 IE8(和 IE7)中添加了 nodeIndex 属性，添加它们的是 jQuery —— 更重要的是:我能以比使用正则表达式替换更好的方式摆脱它们吗？

我工作的网站使用了一堆不同的 JavaScript/jQuery 脚本，因此可能存在冲突，或者至少存在一些脚本组合导致的意外行为。

编辑:在 IE 中禁用 JavaScript 时，属性不存在。

其他提到 nodeIndex 的 StackOverflow 问题: Is nodeIndex a valid DOM element property in IE?

Answer 1

Can anyone tell me why the nodeIndex properties are added in IE8 (and IE7), and is it jQuery that adds them --

这些属性是由 Sizzle(jQuery 选择器引擎，比较 jQuery 源代码中 Sizzle.selectors 对象的定义)添加的，大概是为了不原生支持 的浏览器: nth-child CSS 伪类。

and more importantly: Can I get rid of them in a better way than using a regular expression replacement?

干净的方法是将 HTML 片段加载到 DOM 中并从中删除属性。您可以使用 jQuery 本身在服务器端或客户端执行此操作。

var htmlText = '<DIV nodeIndex="4">Some text.<BR nodeIndex="1"></DIV>';
var $html = $("<div>" + htmlText + "</div>");
$html.find("*[nodeIndex]").removeAttr("nodeIndex");
console.log( $html.html() );
// logs "<div>Some text.<br></div>"