我想知道如何使用纯 javascript 更改标签
<span>some text</span>
我想把它改成那个
<div>some text</div>
我不知道该怎么做。
使用 javascript 更改标签
IT技术
javascript
html
2021-02-19 08:50:50
6个回答
您不能像这样更改元素的类型，而是必须创建一个新元素并将内容移入其中。例子：
var e = document.getElementsByTagName('span')[0];
var d = document.createElement('div');
d.innerHTML = e.innerHTML;
e.parentNode.replaceChild(d, e);
刚刚为此编写了一个 jQuery 插件。
(function( $ ) {
$.fn.replaceTag = function(newTag) {
var originalElement = this[0]
, originalTag = originalElement.tagName
, startRX = new RegExp('^<'+originalTag, 'i')
, endRX = new RegExp(originalTag+'>$', 'i')
, startSubst = '<'+newTag
, endSubst = newTag+'>'
, newHTML = originalElement.outerHTML
.replace(startRX, startSubst)
.replace(endRX, endSubst);
this.replaceWith(newHTML);
};
})(jQuery);
用法：
$('div#toChange').replaceTag('span')
这种方法最大的优点是id保留了原始元素的所有属性。
如果 jquery 是可以接受的，请使用 replaceWith。
$('span').each(function() {
$(this).replaceWith($('<div>' + this.innerHTML + '</div>'));
});
这是一个 JSFIDDLE 工作演示
如果使用 jquery
Var spantxt = $('span').text();
$('body').append('<div>'+spantext+'</div');
请注意，这仅在只有一个跨度时才有效，否则请使用 id 选择器
你不能这样做。你想要做的是获取你的内容span，然后删除它并创建新的div并用以前的内容填充它。