8

我有一个我正在开发的网站，它使用'aside'标签，无论我尝试什么，我都无法让IE8能够阅读，即使使用HTML5 Shiv也是如此。所以，我想知道，你将如何用 jQuery 将现有标签替换为其他标签？

例如，如果我想改变

<aside>
  <h3></h3>
</aside>

到

<div>
  <h3></h3>
</div>

那怎么做？

4

5 回答 5

31

试试这个：

$('aside').contents().unwrap().wrap('<div/>');
  • 先获取内容aside。
  • 现在unwrap是内容。
  • 现在简单地说，wrap新标签中的内容，这里是div.

演示

此外，您可以使用以下.replaceWith()方法执行此操作：

$('aside').replaceWith(function () {
    return $('<div/>', {
        html: $(this).html()
    });
});

演示

于 2013-04-29T18:38:25.900 回答
6 
$('aside').replaceWith('<div><h3></h3></div>');
于 2013-04-29T18:43:15.473 回答
3

这适用于文档中的每个元素并保留内容。div如果元素的内容中有换行符，则使用换行会导致出现许多元素aside。

$('aside').each(function() { $(this).replaceWith("<div>"+$(this).html()+"</div>") });

于 2015-01-09T13:21:15.723 回答
1

这将完成这项工作：

 $('aside').replaceWith( "<div>" + $('aside').html() + "</div>" );

还使用 .html() 提供了一种更动态的方法。

于 2014-08-06T08:11:09.577 回答
1

这是一个替换 HTML5 块标记的解决方案，保留替换 HTML5 标记的 div 上的样式。简单地替换标签就会留下属性。

$('article, aside, figcaption, figure, footer, header, nav, section, source')
    .each(function(){
        var el = $(this),
            html = el.html(),
            attrs = {
                "id": el.attr('id'),
                "classes": el.attr('class'),
                "styles": el.attr('style')
            };

        console.log('Replacing ' + el.prop('tagName') + ', classes: ' + attrs.classes);
        el.replaceWith($('<div></div>').html(html).attr(attrs));
    });

（可能需要对具有“src”和“type”属性的源标签做更多的工作）

于 2016-03-12T14:54:14.830 回答