Question

我有一个使用HTML5 doctype创建的页面，因此它有

<header class="1-header"></header>
<footer class="1-footer"></footer>

是否有可能以编程方式将它们转换为具有相同类的div标签？是否有可以做到的库或代码片段？

<div class="1-header"></div>
<div class="1-footer"></div>

注意：我们的想法是使用html5 doctype开发的html页面在XHTML doctype中工作。现在不担心成功验证。

也不要太担心性能，因为它将成为一个离线工具，可以节省一些转换这些标签的手动工作。

Answer 1

您应该遍历页面中的对象，为每个元素创建一个并行的元素并将新元素的属性设置为等于旧元素，然后对数据进行相同的操作。

可在此处找到一个示例：http://upshots.org/javascript/jquery-change-tag-name

Answer 2

如果你真的需要这样做，你可以用div代替这些元素，带来这些类：

$('header, footer').each(
  function () {
    var el = $(this);

    var div = $('<div>').
      prop('class', el.prop('class'));
      // if you want other attributes, you'll need to add them the same way

    // move contents to the new container
    el.contents().appendTo(div);

    // and replace
    el.replaceWith(div);
  }
);

虽然，当然，如果DOM运行良好并且运行得很好，可以针对HTML5元素运行jQuery，我不确定您是否需要更改任何内容。

将html5标签（带有一些类）转换为具有相同类的div标签

2 个答案: