Mal*_*har 28 javascript jquery dom
当我想检查页面中是否存在元素时.这两个检查是否相同?有没有更好的更紧凑的方式来检查存在?
如果我要检查value == ''
.这也可以包含在此检查中吗?
Poi*_*nty 29
对元素的引用永远不会显示为"falsy",因此不使用显式null检查是安全的.
Javascript会将对布尔上下文中某些值的引用视为false
:undefined,null,numeric zero和NaN
,以及空字符串.但是getElementById
返回的内容将是元素引用,或者为null.因此,如果元素在DOM中,则返回值将是对象引用,并且所有对象引用都true
在if ()
测试中.如果元素不在 DOM中,则返回值将是null
,并且null
始终false
处于if ()
测试中.
包含比较是无害的,但我个人更喜欢保留一些不做任何事情的代码,因为每当我的手指敲击键盘时我都会想到我可能会引入一个bug :)
请注意,那些使用jQuery的人不应该这样做:
if ($('#something')) { /* ... */ }
Run Code Online (Sandbox Code Playgroud)
因为jQuery函数总会返回"truthy" - 即使没有找到任何元素,jQuery也会返回一个对象引用.代替:
if ($('#something').length) { /* ... */ }
Run Code Online (Sandbox Code Playgroud)
编辑 - 关于检查元素的值,不,你不能在你用DOM方法直接检查元素本身的存在的同时做到这一点.同样,大多数框架使其相对简单和干净,正如其他人在他们的答案中所指出的那样.
And*_*dir 17
使用它更好(但更啰嗦):
var element = document.getElementById('something');
if (element != null && element.value == '') {
}
Run Code Online (Sandbox Code Playgroud)
请注意,我的答案的第一个版本是错误的:
var element = document.getElementById('something');
if (typeof element !== "undefined" && element.value == '') {
}
Run Code Online (Sandbox Code Playgroud)
因为getElementById()
总是返回一个对象(如果没有找到空对象),并检查"undefined"
永远不会返回false
,因为typeof null !== "undefined"
仍然是true
.
就这样做:
if(!document.getElementById("someId"){/ some code.注意expresion中的NOT(!) /};
如果id为"someId"的元素不存在,则expresion将返回TRUE(NOT FALSE === TRUE)或!false === true;
试试这段代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="format-detection" content="telephone-no">
<meta name="viewport" content="user-scalable=no, initial-scale=1, minimum-scale=1, maximum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi">
<title>Test</title>
</head>
<body>
<script>
var createPerson = function (name) {
var person;
if (!document.getElementById(name)) {
alert("Element does not exist. Let's create it.");
person = document.createElement("div");
//add argument name as the ID of the element
person.id = name;
//append element to the body of the document
document.body.appendChild(person);
} else {
alert("Element exists. Lets get it by ID!");
person = document.getElementById(name);
}
person.innerHTML = "HI THERE!";
};
//run the function.
createPerson("someid");
</script>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
在你的浏览器中尝试这个,它应该警告"元素不存在.让我们创建它."
现在添加
<div id="someid"></div>
Run Code Online (Sandbox Code Playgroud)
到页面正文,然后再试一次.瞧!:)
归档时间: |
|
查看次数: |
129595 次 |
最近记录: |