使用jQuery更改HTML标记？

Question

使用jQuery更改HTML标记？这个是可能的吗？例子：$('a.change').click(function(){//code to change p tag to h5 tag});<p>Hello!</p><a id="change">change</a>因此，单击更改锚应该会导致<p>Hello!</p>部分更改为(例如)h5标记，以便以<h5>Hello!</h5>点击后。我知道您可以删除p标记并用h5替换它，但是是否有实际修改HTML标记的方法呢？

Answer 1

这里有一个扩展，可以用同样多的方式完成所有的任务.

示例用法：

保留现有的类和属性：

$('div#change').replaceTag('<span>', true);

或

丢弃现有类和属性：

$('div#change').replaceTag('<span class=newclass>', false);

甚至

将所有div替换为span、复制类和属性，添加额外的类名。

$('div').replaceTag($('<span>').addClass('wasDiv'), true);

插件来源：

$.extend({
    replaceTag: function (currentElem, newTagObj, keepProps) {
        var $currentElem = $(currentElem);
        var i, $newTag = $(newTagObj).clone();
        if (keepProps) {//{{{
            newTag = $newTag[0];
            newTag.className = currentElem.className;
            $.extend(newTag.classList, currentElem.classList);
            $.extend(newTag.attributes, currentElem.attributes);
        }//}}}
        $currentElem.wrapAll($newTag);
        $currentElem.contents().unwrap();
        // return node; (Error spotted by Frank van Luijn)
        return this; // Suggested by ColeLawrence
    }});$.fn.extend({
    replaceTag: function (newTagObj, keepProps) {
        // "return" suggested by ColeLawrence
        return this.each(function() {
            jQuery.replaceTag(this, newTagObj, keepProps);
        });
    }});