您的位置:首页 > Web前端 > JQuery

jQuery判断某个元素是否存在

2016-02-28 22:25 639 查看
使用jQuery选择器不仅比使用传统的getElementById()和getElementsByTagName()函数简洁得多,而且还能避免某些错误。

看下面这个例子:

<div>test</div>
<script type="text/javascript">
document.getElementById('tt').style.color = 'red';
</script>

运行上面的代码,浏览器就会报错,原因是网页中没有 id 为 tt 的元素。

经过改进的代码:

<div>test</div>
<script type="text/javascript">
if (document.getElementById('tt')) {
document.getElementById('tt').style.color='red';
}
</script>

在对某个元素进行操作时,先判断该元素是否存在;但如果要操作很多元素,那每个元素都要先判断一下,需要做大量重复的工作。
jQuery就解决了这个问题,即使用jQuery获取网页中并不存在的元素时也不会报错。

代码如下:

<div>test</div>
<script type="text/javascript">
$('#tt').css('color','red');
</script>
有了这个预防措施,以后因为某种原因删除元素,也不用担心javascript代码会报错了。

需要注意的是,$('#tt') 获取的永远是对象,即使网页上没有该元素。

因此当要使用jQuery检查某个元素是否存在时,不能使用如下代码:

if ($('#tt')) {
//do something
}

而应该根据获取到的元素的长度来判断
if ($('#tt').length > 0) {
//do something
}

或者将 jQuery 对象转换为 DOM对象来判断
if ($('#tt')[0]) {
//do something
}
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: