如何在没有类或ID的情况下向按钮添加类或ID？

Question

请帮我添加班级或ID到列表中的按钮（按钮目前没有班级或ID）。

我在我的列表元素中添加了一个按钮，使用：

 $("#cat13").append("<button>expnd</button>"); 

但是如何为新创建的按钮添加类或ID？

提前致谢！

Answer 1

我假设id和/或class来自变量，因此您不希望将它们放在您传递的HTML中append

您可以将属性作为第二个参数提供给$()：

$("#cat13").append($("<button>", {
    text: "expnd",
    id: "the-id",
    class: "the-class"
}));

注意我们必须通过text指定按钮的内容;如果我们传递任何东西，只是一个简单的元素，$()就无法处理它。

另请注意，如果您必须支持IE8或其他过时的浏览器，则需要将class放在引号中："class": "the-class"。对于任何模糊的现代，你都不会;在2009年12月的ECMAScript第5版规范（“ES5”）中允许使用不带引号的关键字。

示例：

$("#cat13").append($("<button>", {
  text: "expnd",
  id: "the-id",
  class: "the-class"
}));

<div id="cat13"></div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

或者只是扭转局面：

$("<button>expnd</button>")
    .attr("id", "the-id")
    .addClass("the-class")
    .appendTo("#cat13");

示例：

$("<button>expnd</button>")
    .attr("id", "the-id")
    .addClass("the-class")
    .appendTo("#cat13");

<div id="cat13"></div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Answer 2

您只需要在普通HTML中执行任何操作。

$("#cat13").append("<button id='my_id' class='my_class'>expnd</button>");