The jQuery object and the dom object call each other's members
Method to obtain the object:
- ##jquery object: $('li') $('.apple' ) The information returned by the selector is the jquery object
- dom object: document.getElementById()
##jquery object and dom object call each other’s members
<!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(){
//$('div').css('background-color','lightgreen');
//dom對象 調(diào)用 jquery對象的成員【失敗】
//document.getElementsByTagName('div')[0].css('background-color','blue');
//成功
$(document.getElementsByTagName('div')[0]).css('background-color','blue');
}
function f2(){
//document.getElementsByTagName('div')[0].style.width="400px";
//jquery對象 調(diào)用 dom對象的成員【失敗】
//$('div').style.height = "300px";
//成功
$('div')[0].style.height = "300px";
}
</script>
<style type="text/css">
div {width:300px;height:200px; background-color:pink;}
</style>
</head>
<body>
<div></div>
<input type="button" value="觸發(fā)1" onclick="f1()" />
<input type="button" value="觸發(fā)2" onclick="f2()" />
</body>
</html>
