jquery物件和dom物件的轉換
jquery物件轉換為dom物件: $()[下標]
<!DOCTYPE html> <html> <head> <title>php.cn</title> <meta charset="utf-8" /> <script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script> <script> function f1(){ //jquery对象 转化为 dom对象 进而调用dom的成员 $('#apple')[0].style.backgroundColor = "blue"; $('li')[1].style.backgroundColor = "brown"; } </script> <style type="text/css"> div {width:300px;height:200px; background-color:pink;} </style> </head> <body> <div id="apple"></div> <ul> <li>北京</li> <li>上海</li> <li>深圳</li> </ul> <input type="button" value="触发1" onclick="f1()" /> </body> </html>
##dom物件轉換為jquery物件:$(dom物件)
#
<!DOCTYPE html> <html> <head> <title>php.cn</title> <meta charset="utf-8" /> <script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script> <script> function f1(){ //dom对象 变为 jquery对象: $(dom对象) //注意:每次只能是"一个"dom对象变为jquery对象 var dv = document.getElementById('apple'); $(dv).css('background-color','green'); var lis = document.getElementsByTagName('li'); $(lis[2]).css('color','red'); } </script> <style type="text/css"> div {width:300px;height:200px; background-color:pink;} </style> </head> <body> <div id="apple"></div> <ul> <li>北京</li> <li>上海</li> <li>深圳</li> </ul> <input type="button" value="触发1" onclick="f1()" /> </body> </html>