Jquery对象和DOM对象之间的转换
Jquery转换成DOM对象:
Jquery中提供了两种方法将一个Jquery对象转换成DOM,即:[index]和get(index)。
1)[indx]方法:Jquery对象是一个数组对象,可以通过[index]的方法得到相应的DOM对象。
var $obj = $(this);//Jquery对象
var obj = $obj[0];//DOM对象
alert($obj+”\n”+obj);//alert出对象类型,如果是Jquery对象,则是”Object”,如果是DOM对象,则是“HTMLObject”
2)、另一种方法是Jquery本身提供的,通过get(index)方法得到相应的DOM对象。
var $obj = $(this);//Jquery对象
var obj = $obj.get(0);//DOM对象
alert($obj+”\n”+obj);
两个实例:
1、 判断对象是否存在:
有时候定了一个Jquery之后,譬如说var $obj=$(“#cs”);可能这个ID为cs的对象并不存在,但是alert($obje);却依然会提示说是个”Object”,在用的时候又会报错说“不支持该对象或方法”了,此时就需要判断该对象是否存在了。可以将Jquery对象转换成DOM对象,然后alert(obj),如果当前对象不存在,则会弹出”undefined”而不是”HTMLObject”。因为$(obj)本身就不存在,取其第一个对象必然也不存在了,就好比Java中“空指针”,对象本身就为空,再取其属性值,必然也是个空。
当然判断对象是否存在,还可以用$obj.length();Jquery对象本来就是个数组对象,必然存在length,若length=0,那么当前对象必然不存在。
2、判断复选框是否选中:
在Jquery对象中,可以通过attr(“checked”)来判断当前复选框是否选中(当然也可以使用$obj.is(“:checked”)来判断,这个返回的是boolean值),但这个方法返回的值跟使用的Jquery库和浏览器的类型是有关系的,可能因为库或浏览器的不同,返回不同的值,如true/false、checked、undefined、或者是空,如果判断不到位就获取不到当前复选框的状态。此时可以用DOM对象的checked属性。这个跟Jquery没有关系,浏览器解析的结果不是true就是false,很容易判断。
var $obj=$(“#cs”);
var obj = $obj[0];
alert($obj.attr(“checked”));
alert(obj.checked);
DOM对象转换成Jquery对象:
在平常使用中,用到的Jquery对象都是通过$()函数制造出来的,$()函数就是一个Jquery对象的制造工厂,所以,DOM对象要转换成Jquery对象,只需要用$()把DOM对象包装起来,就可以得到一个Jquery对象。
var obj = document.getElementById(“id”);
var $obj = $(obj);
alert(obj+” \n” +$(obj));