如何使用jquery更改元素类型

Question

如何使用jquery更改元素类型

我有以下代码

<b class="xyzxterms" style="cursor: default; ">bryant keil bio</b>

如何将b标签替换为标签，h1但保留所有其他属性和信息？

Answer 1

关于jQuery不确定。使用纯JavaScript，您可以：var&nbsp;new_element&nbsp;=&nbsp;document.createElement('h1'), &nbsp;&nbsp;&nbsp;&nbsp;old_attributes&nbsp;=&nbsp;element.attributes, &nbsp;&nbsp;&nbsp;&nbsp;new_attributes&nbsp;=&nbsp;new_element.attributes;//&nbsp;copy&nbsp;attributesfor(var&nbsp;i&nbsp;=&nbsp;0,&nbsp;len&nbsp;=&nbsp;old_attributes.length;&nbsp;i&nbsp;<&nbsp;len;&nbsp;i++)&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;new_attributes.setNamedItem(old_attributes.item(i).cloneNode());}//&nbsp;copy&nbsp;child&nbsp;nodesdo&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;new_element.appendChild(element.firstChild);}&nbsp;while(element.firstChild);//&nbsp;replace&nbsp;elementelement.parentNode.replaceChild(new_element,&nbsp;element);DEMO虽然不确定跨浏览器兼容性如何。变化可能是：for(var&nbsp;i&nbsp;=&nbsp;0,&nbsp;len&nbsp;=&nbsp;old_attributes.length;&nbsp;i&nbsp;<&nbsp;len;&nbsp;i++)&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;new_element.setAttribute(old_attributes[i].name,&nbsp;old_attributes[i].value);}有关更多信息，请参阅Node.attributes&nbsp;[MDN]。

Answer 2

这是一个进一步的改进，因此它可以同时处理多个元素。$.fn.changeElementType&nbsp;=&nbsp;function(newType)&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;var&nbsp;newElements&nbsp;=&nbsp;[]; &nbsp;&nbsp;&nbsp;&nbsp;$(this).each(function()&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;var&nbsp;attrs&nbsp;=&nbsp;{}; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;$.each(this.attributes,&nbsp;function(idx,&nbsp;attr)&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;attrs[attr.nodeName]&nbsp;=&nbsp;attr.nodeValue; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;var&nbsp;newElement&nbsp;=&nbsp;$("<"&nbsp;+&nbsp;newType&nbsp;+&nbsp;"/>",&nbsp;attrs).append($(this).contents()); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;$(this).replaceWith(newElement); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;newElements.push(newElement); &nbsp;&nbsp;&nbsp;&nbsp;}); &nbsp;&nbsp;&nbsp;&nbsp;return&nbsp;$(newElements);};