我需要将DOM元素转换为其他类型(如HTML标记名称,在这种情况下为a
到p
),但仍保留所有原始元素属性。在这种情况下,它们对于新类型是否有效都无关紧要。
有关如何执行此操作的任何建议?
我看过只是创建一个新元素并复制属性,但这并非没有其自身的复杂性。在Firefox中,DOMElement.attributes
仅有助于包含带有值的属性,但在IE中,它会报告该元素的所有可能的属性。 attributes
属性本身是只读的,因此无法复制它。
最佳答案
Sans-jQuery解决方案:
function makeNewElementFromElement( tag, elem ) {
var newElem = document.createElement(tag),
i, prop,
attr = elem.attributes,
attrLen = attr.length;
// Copy children
elem = elem.cloneNode(true);
while (elem.firstChild) {
newElem.appendChild(elem.firstChild);
}
// Copy DOM properties
for (i in elem) {
try {
prop = elem[i];
if (prop && i !== 'outerHTML' && (typeof prop === 'string' || typeof prop === 'number')) {
newElem[i] = elem[i];
}
} catch(e) { /* some props throw getter errors */ }
}
// Copy attributes
for (i = 0; i < attrLen; i++) {
newElem.setAttribute(attr[i].nodeName, attr[i].nodeValue);
}
// Copy inline CSS
newElem.style.cssText = elem.style.cssText;
return newElem;
}
例如。
makeNewElementFromElement('a', someDivElement); // Create anchor from div