接下来介绍jq对HTML的标签追加类名和增加内容。 如果不加jq，代码如下：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style type="text/css"> .box2{ background: red; width: 100px; height: 100px; } </style> </head> <body> <div id="box1"></div> <ul> <li></li> <li></li> <li></li> </ul> <ul> <li></li> <li></li> <li></li> <li></li> </ul> </body> </html>div和ul li标签没有写任何内容，也没有赋予类名box2 增加jq代码
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style type="text/css"> .box2{ background: red; width: 100px; height: 100px; } </style> <script src="jquery-1.12.4.min.js"></script> <script type="text/javascript"> $(function () { $('#box1').addClass('box2');//追加样式(增加类名) $('ul li').html('lll')//增加内容 }) </script> </head> <body> <div id="box1"></div> <ul> <li></li> <li></li> <li></li> </ul> <ul> <li></li> <li></li> <li></li> <li></li> </ul> </body> </html>运行效果： 通过追加类名使得上面的css样式可以再div标签执行，".html()"可以在选择的标签中增加需要的内容。
