30、实例 jQuery对象与Dom对象的区别以及转换

最新推荐文章于 2023-02-05 16:23:26 发布

xuxianmei

最新推荐文章于 2023-02-05 16:23:26 发布

阅读量597

点赞数

分类专栏： jQuery

本文链接：https://blog.csdn.net/tlxxm/article/details/37592059

版权

jQuery 专栏收录该内容

63 篇文章 0 订阅

订阅专栏

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>jQuery对象与Dom对象的区别以及转换</title>
<!--
DOM是文档对象模型。
DOM对象 是文档对象模型中的一个节点（元素）。

jQuery是一个框架，里面有方法，属性
jQuery对象是通过jQuery框架包装DOM对象（或者对象集合）之后产生的一个新对象，

本质上说：jQuery对象仅是DOM对象的集合，因此可以把DOM对象看做是一个独立的个体，而jQuery可以是多个DOM对象组成的数据集合。

简单来说：jQuery对象是DOM元素的数组，也称为类数组，而DOM对象就是一个单个DOM元素。

注：jQuery对象不能使用DOM对象的方法，同理反过来。需要时需要进行转换。


-->
<script type="text/javascript" src="jquery-2.1.0.js"></script>
<script>
$(document).ready(function() {
	var li_s=$("li");//返回元素li集合(所有的li元素) 这是一个jQuery对象
	var li=li_s[0];//将jQuery对象中的第一个li返回，生成一个DOM对象.  或者 li=li_s.get(0);
	alert(li.innerHTML);
    
});
$(document).ready(function()
{
	var li=document.getElementsByTagName("li");//获取所有li元素
	var li_s=$(li[1]); //把第一个li元素封装为jQuery对象 也可以把所有的li元素封装成jQuery对象，li_s=$(li);
	alert(li_s.html());//
	});
</script>
</head>

<body>
<ul>
<li>列表1</li>
<li>列表2</li>
<li>列表3</li>
</ul>
</body>
</html>