jquery选择器的优势

jquery中的选择器完全继承了CSS的风格,利用jquery选择器,可以非常方便地找出特定的DOM元素,然后为它们添加相应的行为,而无需担心浏览器是否支持这一选择器。jquery中涉及操作CSS样式的部分比单纯的CSS功能更为强大,并且拥有跨浏览器的兼容性

jquery选择器的优势


jquery选择器的优势

1.简洁的写法

$()函数在很多javascript类库中都被作为一个选择器函数来使用,在jquery中也是如此。例如$("#id")用来代替document.getElementById(),即通过id获取元素;$("tagName")用来代替document.getElementsByTagName(),即通过标签名获取HTML元素。

jquery选择器的优势

2.支持CSS1到CSS3选择器

jquery选择器支持CSS1、CSS2的全部和CSS3的部分选择器,同时它也有少量独有的选择器。CSS选择器需要考虑浏览器的兼容性问题,而jquery选择器拥有跨浏览器的兼容性

3.完善的处理机制

使用拥有跨浏览器的兼容性选择器不仅比传统的document.getElementById()和document.getElementsByTagName()简洁得多,而且还能避免某些错误。

比如使用document.getElementById()获取并操作元素时,如果该元素在页面上并不存在,浏览器就会报错。为了避免这种情况,需要在操作元素之前判断钙元素是否存在,正确的做法是:

<script type="text/javascript">

if(document.getElementById("tt")){

document.getElementById("tt").style.color="red";

}

</script>

这样就可以避免浏览器报错,但是对每个要操作的元素进行判断会显得很繁琐。jquery在上述问题的处理上是非常不错的,即使用jquery获取网页中不存在的元素也不会报错,例如:

<script type="text/javascript">

$('#tt').css("color","red");//这里无需判断$('#tt')是否存在

</script>

有了这个预防措施,即使以后因为某种原因删除网页上的某个元素,也不用担心jquery代码会报错。

需要注意的是,$("#id")获取的永远是对象,并且默认是数组,即使网页上没有此元素,因此要用jquery检查某个元素在网页上是否存在时,不能像javascript那样使用对象本身来判断,而应该根据获取到的元素的长度来判断,即:

<script type="text/javascript">

if($('#tt').length>0){

//do something

}

</script>

或者转化为DOM对象来判断:

<script type="text/javascript">

if($('#tt').[0]){

//do something

}

</script>

这与javascript中直接判断对象(if(document.getElementById("tt")))是不同的,尤其需要注意。


以上即为jquery相比于javascript的优势,需要在实际的使用过程中仔细体会。
阅读更多
想对作者说点什么? 我来说一句

没有更多推荐了,返回首页