jQuery：如何更改标签名称？
例如：
<tr>
$1
</tr>
我需要
<div>
$1
</div>
我可以
- 创建 DOM 元素 <div>
- 复制tr内容到div
- 从dom中删除tr
但是我可以直接做吗？
PS：
$(tr).get(0).tagName = "div";
结果在DOMException.
jQuery：如何更改标签名称？
IT技术
javascript
jquery
html
dom
dhtml
2021-02-04 10:01:11
6个回答
您可以使用 jQuery 的.replaceWith()方法替换任何 HTML 标记。
示例：http : //jsfiddle.net/JHmaV/
参考：。用。。。来代替
如果要保留现有标记，可以使用如下代码：
$('#target').replaceWith('<newTag>' + $('#target').html() +'</newTag>')
不，根据 W3C 规范，这是不可能的：“DOMString 类型的 tagName，只读”
DOM renameNode() 方法在哪里？
今天（2014 年）没有浏览器理解新的 DOM3 renameNode 方法（另见W3C）检查是否在你的浏览器上运行：http : //jsfiddle.net/k2jSm/1/
所以，DOM 解决方案很难看，我不明白为什么 (??) jQuery 没有实现解决方法？
纯DOM算法
createElement(new_name)- 将所有内容复制到新元素；
- 将旧的替换为新的
replaceChild()
是这样的，
function rename_element(node,name) {
var renamed = document.createElement(name);
foreach (node.attributes as a) {
renamed.setAttribute(a.nodeName, a.nodeValue);
}
while (node.firstChild) {
renamed.appendChild(node.firstChild);
}
return node.parentNode.replaceChild(renamed, node);
}
...等待审查和jsfiddle ...
jQuery 算法
@ilpoldo 算法是一个很好的起点，
$from.replaceWith($('<'+newname+'/>').html($from.html()));
正如其他人评论的那样，它需要一个属性副本......等待通用......
具体来说class，保留属性，见http://jsfiddle.net/cDgpS/
上述解决方案清除了现有元素并从头开始重新创建它，在此过程中破坏了子项上的任何事件绑定。
简短回答：（丢失的属性）
$("p").wrapInner("<div/>").children(0).unwrap();
更长的答案：（副本的属性）
$("p").each(function (o, elt) {
var newElt = $("<div class='p'/>");
Array.prototype.slice.call(elt.attributes).forEach(function(a) {
newElt.attr(a.name, a.value);
});
$(elt).wrapInner(newElt).children(0).unwrap();
});
同时从 复制任何绑定会很酷，但获取当前绑定对我不起作用。
要保留标签的内部内容，您可以将访问.html()器与.replaceWith()
分叉示例：http : //jsfiddle.net/WVb2Q/1/