无法在JQUERY中将ID设置为动态创建的标签

Question

我在jquery中动态创建了一个标签。我需要为该标签指定某些样式。在这里，我尝试为该标签分配一个唯一的ID并应用样式。但它不起作用。

我的代码是;

的Javascript

var lbl = $("<label>").text('Welcome');
lbl.id = "test";
$("#sec").append(lbl);

CSS

#test
{
  color:red;
  font-size:20px;
}

如何将ID分配给动态标签？

Answer 1

您需要使用lbl.prop("id","test")，因为您已将lbl作为jQuery元素而不是javascript / DOM元素启动，因此它没有id属性。

Answer 2

需要使用

var lbl = $("<label>", {
   id: 'test'
}).text('Welcome');

$("#sec").append(lbl);

或使用attr

var lbl = $("<label>").text('Welcome');
lbl.attr('id', "test");
$("#sec").append(lbl);

Answer 3

动态添加内容并不困难。

请参阅以下代码：

<强> HTML：

<label id ='lbl'>This is a label </label>
<button id ='btn'>Click</button>

JS：

$("#btn").click(function(){
    $("#lbl").css("color","red");
    $("#lbl").css("fontSize","20px");
});

此处的工作解决方案：http://jsfiddle.net/baEWb/

或

如果您只想使用label而不是任何标签ID或类，那么：

$("#btn").click(function(){
    $("label").css("color","red");
    $("label").css("fontSize","20px");
});

小提琴：http://jsfiddle.net/baEWb/1/

Answer 4

使用以下代码

var lbl = $("<label id='test'>").text('Welcome');
$("#sec").append(lbl);

在标签标签

中加上“id ='test'”