1、jQuery的包裹节点
2、代码
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>jQuery的包裹节点</title> <script type="text/javascript" src="jquery-1.7.2.js"></script> <script type="text/javascript"> //测试使用 jQuery wrap, wrapAll, wrapInner $(function(){ //1.包装li本身 $("#city li").wrap("<font color='red'></font>"); //2.包装所有的li $("#city li").wrapAll("<font color='red'></font>"); //3.包装li里边的文字. $("#city li").wrapInner("<font color='red'></font>"); }) </script> </head> <body> <p>你喜欢哪个城市?</p> <ul id="city"> <li id="bj" name="BeiJing">北京</li> <li>上海</li> <li id="dj">东京</li> <li id="se">首尔</li> </ul> <br> <p>你喜欢哪款单机游戏?</p> <ul id="game"> <li id="rl">红警</li> <li>实况</li> <li>极品飞车</li> <li>魔兽</li> </ul> <br> </body> </html>
3、原始界面
4、案例1
5、案例2
6、案例3