有时候我们需要用选择器获取JQuery对象,并判断是否有满足条件的DOM节点存在
但是需要注意一点
由于 $(selector) 不论什么情况都会返回JQuery 对象, 所以不能按照以下的方式 判断节点是否存在
if($('#tt')){
console.log("不能以 if($('#tt')) 这种方式判断DOM是否存在");
}
需要按照下面的方式判断
正确做法
方式一
if($('#dd.outClass').length >0){
console.log("需要以 if($('#dd.outClass').length >0) 这种方式判断DOM是否存在");
}
正确做法
方式二
if($('#dd.outClass')[0]){
console.log("需要以 if($('#dd.outClass')[0]) 这种方式判断DOM是否存在");
}
整体代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>外部样式和内部样式的优先级</title>
<link rel="stylesheet" href="css/testOutStyle.css"/>
<style type="text/css">
#dd{
background-color: gold;
}
</style>
<script src="js/jquery-1.11.3.js"></script>
</head>
<body>
<div id="dd" class="outClass" style="width: 200px; height:400px;"></div>
<script>
if($('#tt')){
console.log("不能以 if($('#tt')) 这种方式判断DOM是否存在");
}
if($('#dd.outClass').length >0){
console.log("需要以 if($('#dd.outClass').length >0) 这种方式判断DOM是否存在");
}
if($('#dd.outClass')[0]){
console.log("需要以 if($('#dd.outClass')[0]) 这种方式判断DOM是否存在");
}
</script>
</body>
</html>