Question

在将产品上传到我的网站时，通常我会从制造商的网站复制信息，然后粘贴到我的所见即所得编辑器中。这还将复制我不需要/不需要的所有属性和样式。

我创建了一个文件，该文件剥离了所有属性和样式的代码，以便可以添加自己的代码。这是供完全不了解HTML的人使用的，所以我想知道是否有比我选择的方法更好的方法。

当前div上附加了一些样式，因此当删除该div时，会收到视觉反馈，表明代码已被清除。

<button>Clean up code</button>

<div class="test" id="text" style="text-transform: uppercase;">

    <!-- PASTE YOUR CODE UNDER HERE -->

</div>

<script>


$( "button" ).click(function() {
    $("p").removeAttr("class").removeAttr("id").removeAttr("style");
    $("a").removeAttr("class").removeAttr("id").removeAttr("style");
    $("img").removeAttr("class").removeAttr("id").removeAttr("style");
    $("h1").removeAttr("class").removeAttr("id").removeAttr("style");
    $("h2").removeAttr("class").removeAttr("id").removeAttr("style");
    $("h2").removeAttr("class").removeAttr("id").removeAttr("style");
    $("h2").removeAttr("class").removeAttr("id").removeAttr("style");
    $("h3").removeAttr("class").removeAttr("id").removeAttr("style");
    $("h4").removeAttr("class").removeAttr("id").removeAttr("style");
    $("h5").removeAttr("class").removeAttr("id").removeAttr("style");
    $("h6").removeAttr("class").removeAttr("id").removeAttr("style");
    $("table").removeAttr("class").removeAttr("id").removeAttr("style");
    $("td").removeAttr("class").removeAttr("id").removeAttr("style");
    $("tr").removeAttr("class").removeAttr("id").removeAttr("style");
    $("ol").removeAttr("class").removeAttr("id").removeAttr("style");
    $("ul").removeAttr("class").removeAttr("id").removeAttr("style");
    $("li").removeAttr("class").removeAttr("id").removeAttr("style");
    $("tbody").removeAttr("class").removeAttr("id").removeAttr("style");    
    $("span").removeAttr("class").removeAttr("id").removeAttr("style");
    $( "div" ).contents().unwrap();
});
</script>

Answer 1

您可以使用*，它基本上选择了所有元素。此外，removeAttrs可以是用空格分隔的属性列表。

$( "button" ).click(function() {
    $("*").removeAttr("class id style");
    $("div").contents().unwrap();
});

所有属性和样式的条码

1 个答案: