javascript - 替换节点名称

Question

是否可以替换节点名称？喜欢:

HTML:

<strong id="element">Text</strong>

Javascript:

var element = document.getElementById("element");
    element.nodeName = "b";

我看到它不起作用，如果以这种方式不可能，那怎么办？

我为什么需要它:

我正在构建一个文本编辑器，IE 在 execCommand() 函数中使用 strong 而不是 b，我想改变它，我尝试从头开始构建 execCommand("bold") 但有很多即使在 IE 8 和 9 之间也存在问题和差异。所以现在我决定更改它的节点名称，这真的很容易，但不起作用.. :(

注意:我需要它才能在 Internet Explorer 中工作。

谢谢

Answer 1

没有，但是你可以轻松替换节点:

var oldNode = document.getElementById('element'),
    newNode = document.createElement('b'),
    node,
    nextNode;

node = oldNode.firstChild;
while (node) {
    nextNode = node.nextSibling;
    newNode.appendChild(node);
    node = nextNode;
}

newNode.className = oldNode.className;
// Do attributes too if you need to
newNode.id = oldNode.id; // (Not invalid, they're not both in the tree at the same time)
oldNode.parentNode.replaceChild(newNode, oldNode);

Live example

非常感谢浩驰指出replaceChild，我已经做到了:

oldNode.parentNode.insertBefore(newNode, oldNode);
oldNode.parentNode.removeChild(oldNode);

Live example ...但是 replaceChild 更干净。

文档:

• DOM2 core
• DOM2 HTML
• DOM3 core