为什么如果id不存在,$('#id')会返回true?
我总是想知道为什么如果我试图通过id结构中不存在的id选择器来查找元素,jQuery将返回true。
喜欢这个:
<div id="one">one</div>
<script>
console.log( !!$('#one') ) // prints true
console.log( !!$('#two') ) // is also true! (empty jQuery object)
console.log( !!document.getElementById('two') ) // prints false
</script>
我知道我可以使用!!$('#two').length
从长度=== 0如果对象是空的,但对我来说似乎合乎逻辑,如果找到选择器将返回元素,否则为null
document.getElementById
)。
F.ex,这个逻辑不能在jQuery中完成:
var div = $('#two') || $('<div id="two"></div>');
如果没有找到ID选择器返回null,它会更合乎逻辑吗?
任何人?
这种行为被选中,否则jQuery会定期抛出NullReference异常
几乎所有的jQuery函数都会返回一个jQuery对象作为所讨论的Dom元素的包装器,因此您可以使用点符号。
$("#balloon").css({"color":"red"});
现在想象$("#balloon")
返回null。 这意味着$("#balloon").css({"color":"red"});
会抛出一个错误,而不是像你所期望的那样默默无闻。
因此,你只能使用.length
或.size()
。
这就是jQuery的工作原理。
$("#something")
对象0 = div#东西长度= 1 jquery = 1.2.6
$("#nothing")
对象长度= 0 jquery = 1.2.6
通过访问元素的长度,你可以接近做你想要的,并与三元运算符结合:
console.log(!!$('#notfound').length); // false
console.log(!!$('#exists').length); // true
var element= $('#notfound').length ? $('#notfound') : $('#exists');
console.log(element.attr('id')); // outputs 'exists'
至于问题的核心:
如果没有找到ID选择器返回null,它会更合乎逻辑吗?
不,不适用于JQuery的做事方式 - 即支持链接JQuery语句:
$('#notfound').hide("slow", function(){
jQuery(this)
.addClass("done")
.find("span")
.addClass("done")
.end()
.show("slow", function(){
jQuery(this).removeClass("done");
});
});
即使notfound
不存在这个代码将不会停止执行脚本运行。 如果初始选择器返回null,则必须添加if / then块以检查null。 如果addClass,find,end和show方法返回null,则必须添加if / then块以检查每个方法的返回状态。 链接是处理动态类型语言(如Javascript)中的程序流程的绝佳方式。