jQuery对象与dom对象关系

发布时间：1年前作者：老郭热度： 2233 ℃评论数：

# jQuery对象与dom对象关系

>  jQuery对象与dom对象关系：

```
jQuery对象：$("li") $(".apple") $("#one")
dom对象：document.getElementById()
document.getElementsByName()
```

#### 互相对方的成员
```
<script type="text/javascript">
	function f1() {
	// jQuery对象去调用dom对象的成员【失败】
	// $(...).style is undefined
	$('h2').style.background-color = "lightblue";
	}

function f2() {
	// dom对象去调用jQuery对象的成员【失败】
	// document.getElementsByTagName(...)[0].css is not a function 
	document.getElementsByTagName('div')[0].css('color','blue');
	}
</script>
```

#### jquery对象和dom对象的转换

```
    2.1jquery对象转换为dom对象
    $()[下标]
	
    Jquery对象变为dom对象之后可以调用dom对象的成员：
    function f1(){
		//document.getElementByTagName('h2')[0].style.backgroundColor
		//jQuery对象去调用dom对象的成员【失败】
		//$(...).style is undefined
		//$('h2').style.backgroundColor = "lightblue";
		//"jQuery对象"变为"dom对象"才可以调用对方成员【成功】
		$('h2')[0].style.backgroundColor = "lightgreen";
    }

2.2 dom对象转换为jquery对象
    $(dom对象)：

function f2() {
		// $('div').css('color','red');
		// dom对象去调用jQuery对象的成员【失败】
		var dv = document.getElementsByTagName('div')[0];
		//document.getElementsByTagName(...)[0].css isnot a function
		//dv.css('color','blue');
		//"dom对象"变为"jQuery对象"才可以调用对方成员【成功】
		//$(dom对象) dom对象选择器
		$(div).css('color','orange');
    }
```

jQuery,dom

上一篇：jQuery快捷操作

下一篇：jQuery的事件加载机制

栏目导航

Ajax是什么？ 659 ℃
网站禁止浏览器缓存 742 ℃
Ajax之get方式请求 2056 ℃
Ajax之post方式请求 1637 ℃
Json使用 590 ℃
无刷新表单信息提交 854 ℃
使用Ajax中$.post方法前台获取json数据，将数据转换为... 1159 ℃
细说jQuery的选择器 840 ℃
jQuery的属性操作 1617 ℃
jQuery快捷操作 751 ℃
jQuery对象与dom对象关系 2233 ℃
jQuery的事件加载机制 978 ℃
jQuery属性选择器使用 1620 ℃
jQuery基本动画效果 1791 ℃
利用Ajax技术实现天气预报接口 849 ℃

jQuery对象与dom对象关系

栏目导航

相关文章

微信小程序

手机扫码访问