jQuery和DOM对象互转

jQuery和DOM对象互转

jQuery和DOM作为开发想必我们都或多或少的有接触，但是很多时候容易混淆，特别是刚接触的新手，往往会分不清什么是jQuery对象，什么是DOM对象？

jQuery对象需要引入jQuery的js，其实我们可以理解它就是一个类库，官网下载地址http://jquery.com/download/ ，在使用上语法很精简var $obj=$("#id")orvar $obj=jQuery("#id") ，需要注意的是我们变量的命名一般以$ 开头，这也就意味着它是一个jQuery对象，拥有操作jQuery对象的属性及方法

DOM对象则是通过原生的JavaScript获得的对象，就是页面中的document，该对象的命名我们一般就是直接写变量名就行了var html=document.getElementById("id").innerHTML;

举个例子：要获得页面中id为test的HTML代码，使用jQuery我们可以直接用$("#test").html(); 使用DOM方式为document.getElementById("test").innerHTML 这是两种不同对象取值的方式，对应的方法都是特定的，不能再document对象上使用html()，反之一样

很多时候只是某一个对象难以满足我们的业务场景，我们需要对象相互间进行转换，从而使用不同对象的属性及其方法去实现我们的功能，首先jQuery转DOM，只需要在拿到jQuery对象后采用[index]数组下标的方式或者get(0) var test=$("test").[0]; or var test=$("test").get(0); 这样我们得到的test对象就是一个DOM对象，DOM转jQuery则只需要把拿到的对象放入$(DOM对象) 中即可完成转换 var $test=$(document.getElementById("test")); 我们得到的$test 即为jQuery对象

这两者对象在使用上还是有一定差别，建议大家多去看看API文档，最主要的还是要自己多练习，

以上内容为本人自己理解以及结合工作学习中遇到的问题总结而成，写出来的目的是为了记录自身的学习成长历程，另外能够给一些初入门的朋友在学习上一些参考的话也算是对他人的一种帮助，不保证百分百准确，有错误地方欢迎大家指出，互相探讨交流！