一、准备工作
在使用jquery前，需要在html文件中引入jquery库。在本例中，我们将使用jquery 3.5.1版本：
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
二、动态添加div
在jquery中，可以使用append()方法动态添加元素。该方法接受一个参数，用于指定要添加的内容。可以是html标记、dom元素、文本或jquery对象。
例如，我们可以使用以下代码在body元素中添加一个div：
$(body).append(<div>这是一个新的div</div>);
上述代码中，我们使用$()函数选择body元素，并使用append()方法添加一个新的div元素。添加的内容字符串可以是任意的html标记或纯文本。
如果要动态添加多个元素，可以将它们放在一个字符串中，使用逗号隔开。例如：
$(body).append(<div>这是第一个div</div>, <div>这是第二个div</div>);
这将在body元素中添加两个div元素。
三、设置属性值
一旦添加了新的div元素，就可以使用attr()方法来设置属性值。attr()方法接受两个参数，第一个参数为要设置的属性名称，第二个参数为属性值。例如：
$(body).append(<div>这是一个新的div</div>);$(div).attr(id, new-div);
上述代码将为新添加的div元素设置了id属性，并将其值设置为new-div。
可以使用prop()方法来设置布尔值属性的值，例如：
$(input).prop(checked, true);
上述代码将所有input元素的checked属性设置为true。
除了使用attr()和prop()方法外，还可以使用css()方法来设置css属性值。例如，可以将新添加的div元素的背景颜色设置为蓝色：
$(div).css(background-color, blue);
使用css()方法可以设置任何css属性，包括颜色、字体、大小、边框等。
四、完整示例代码
下面是一个完整的示例代码，它动态添加了两个div元素，并设置它们的id属性和背景颜色：
<!doctype html><html><head> <title>jquery动态添加div并设置属性值</title> <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <script> $(document).ready(function() { $(body).append(<div>这是第一个新的div</div>); $(body).append(<div>这是第二个新的div</div>); $(div).eq(0).attr(id, div1).css(background-color, blue); $(div).eq(1).attr(id, div2).css(background-color, green); }); </script></head><body></body></html>
上述代码中，我们使用$(document).ready()函数确保在页面完全加载后再执行javascript代码。我们先在body元素中添加了两个新的div元素，然后使用eq()方法选择它们中的一个。最后，我们使用attr()方法设置div1的id属性，并使用css()方法设置背景颜色为蓝色。接着选择div2元素，使用attr()方法设置其id属性，并使用css()方法设置背景颜色为绿色。
五、总结
在jquery中动态添加div元素并设置属性值，是一个常见的需求。我们可以使用append()方法添加新的div元素，使用attr()、prop()和css()方法来修改元素的属性和样式。为了保持代码的可读性和可维护性，建议将javascript代码放在单独的文件中，并在html文件中引用。
以上就是详解jquery动态添加div并设置属性值的方法的详细内容。