1

考虑以下代码：

var element = document.CreateElement("div");
element.toString(); // [object HTMLDivElement]

var element = document.CreateElement("somerandomtag");
element.toString(); // [object HTMLUnknownElement]

我的直觉是，一旦创建了一个元素，它本质上就是“强类型”（如果 JavaScript 中存在这种东西），因为“div”创建 aHTMLDivElement而“somerandomtag”创建 a HTMLUnknownElement，因此标签不能更改，因为创建的对象直接对应于那个标签。

考虑以下代码：

var element = document.CreateElement("div");
element.toString(); // [object HTMLDivElement]

element.nodeName = "span"; // Doesn't work.
element.tagName = "span"; // Doesn't work.

那么，除了对象的创建之外，是否可以将元素从一种类型（例如“div”）更改为另一种类型（例如“span”）？

编辑：请注意...必须使用纯 javascript 完成...没有 jQuery 或其他库/api

4

1 回答 1

3

无论元素是什么，元素的 tagName 都是只读的（不可变的） 。如果不对 DOM 进行一些重建，就无法更改元素的标签名称。也就是说，不可能更改现有元素，但创建新元素并附加现有元素的子元素并不难。

var node = document.querySelector('div'),
    newNode = document.createElement('span'),
    parent = node.parentNode,
    children = node.childNodes;

Array.prototype.forEach.call(children, function (elem) {
    newNode.appendChild(elem);
});
parent.replaceChild(newNode, node);

http://jsfiddle.net/ExplosionPIlls/wwhKp/

于 2013-06-11T10:41:17.733 回答