document.getElementById("id") 与 $("#id") 的区别

document.getElementById("id") 与 $("#id") 的区别
如果仅从定位到元素的角度来看的话,两都是一样的.
区别:
document.getElementById()返回的是DOM对象,而$()返回的是jQuery对象。
$('#test'):是一个jquery写法,#test是一个过滤器表示方法,表示查找一个id是test的节点,返回的是一个数组对象,数组的[0]表示dom节点。
document.getElementById('test'):表示从document中查找一个id是test的dom节点。

document.getElementById("id") 与$("#id")并不等价。但是:document.getElementById("id") = $("#id")[0]

jQuery对象是jQuery独有的,其可以使用jQuery里的方法。
虽然jQuery对象是包装DOM对象后产生的,但是jQuery无法使用DOM对象的任何方法,同理DOM对象也不能使用jQuery里的方法。
例如:html()是jQuery里的方法。innerHTML是DOM对象的属性

$('#test').html() = document.getElementById("id") .innerHTML

DOM对象转jQuery对象 
普通的Dom对象一般可以通过$()转换成jQuery对象。 
如:$(document.getElementById("test")) 
返回的就是jQuery对象,可以使用jQuery的方法。 

jQuery对象转DOM对象 
jQuery对象是一个数组对象,可以通过[index]的方法,来得到相应的DOM对象。
另外、jQuery本身提供,通过.get(index)方法,得到相应的DOM对象
如: $("#test")[0],$("div").eq(1)[0],$("td")[5] 、$("#test").get(0)
这些都是Dom对象,可以使用Dom中的方法,但不能再使用jQuery的方法。 

以下几种写法都是正确的: 

$("#test").html(); 
$("#test")[0].innerHTML; 
$("#test").eq(0)[0].innerHTML; 
$("#test").get(0).innerHTML;

API参照:
http://www.w3school.com.cn/jsref/dom_obj_all.asp
http://www.w3school.com.cn/jquery/index.asp

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值