为什么虽然点击多次只添加了1 <h1> </h1>

时间:2013-11-12 15:13:33

标签: jquery

我使用以下代码将处理程序挂钩到按钮。我希望每次点击都会在<h1>下添加新的<p>行。但无论我点击多少次,总共只有1 <h1>。为什么呢?

$("#click_me").click(function () {
    $("p").append($('h1').text('i am new bold2'));
});

3 个答案:

答案 0 :(得分:10)

您没有创建新的h1,而是选择页面中已存在的h1元素,然后将其附加到p元素。

当您说h1(元素选择器)时,您正在使用$('h1')作为选择器,而如果您想创建一个新元素,则必须说$('<h1 />')

$("#click_me").click(function () {
    $("p").append($('<h1 />').text('i am new bold2'));
});

演示:Fiddle

我使用的另一个版本是

$("#click_me").click(function () {
    $("p").append($('<h1 />', {
        text: 'i am new bold2'
    }));
});

答案 1 :(得分:4)

你不能只用$('h1')创建一个&lt; H1&gt;你需要使用$('&lt; h1 /&gt;')

$("#click_me").click(function () { $("p").append($('<h1 />').text('i am new bold2')); });

答案 2 :(得分:4)

$('h1')不会创建元素,它会引用任何现有的h1元素(其中有一个元素)。要创建一个,您需要选择器包含整个标记结构:

$('<h1 />')