Question

我按一个按钮插入一个div，让我们说id =“exists”使用javascript。最初，没有这样的元素。如何检查具有id的元素是否存在？我使用了以下代码：

if(document.getElementById("tag_exist").innerHTML == "null")
        console.log("1111");

但是它不会在控制台中输出1111而是错误（Uncaught TypeError：无法读取属性'innerHTML'的null）。问题是它不执行我需要运行的代码。如何检查具有id的元素是否存在？

Answer 1

测试元素是否存在。不要获取元素，然后尝试读取你得到的任何东西的innerHTML（因为如果元素不存在，那将抛出异常）

if (document.getElementById("tag_exist"))

Answer 2

在访问任何属性或方法之前，您应该这样做。

if(document.getElementById("tag_exist")) {
  //exists
}

Answer 3

如果id不存在，循环将执行块

if (!document.getElementById("tag_exist")) {
// didn't exist
}

Answer 4

试试这个

if(document.getElementById("exist") != undefined) {
      //exists
}

Answer 5

代码中的问题是，如果没有if((document.getElementById("tag_exist") || {}).innerHTML == null) // code元素，浏览器引擎会抛出“无法从undefined中读取innerHTML属性”，或者没有任何反应。发生这种情况是因为如果没有找到元素，getElementById将返回undefined。

您可以选择写：

if((document.getElementById("tag_exist"))
  // code

或

if((document.getElementById("tag_exist") !== undefined && (document.getElementById("tag_exist") !== null))
  // code

最后一个选择代表：

Get-Mailbox -resultsize unlimited|foreach {Get-MobileDeviceStatistics -Mailbox:$_.identity} |Select-Object @{l="user";e={$_.Identity.parent.parent.name}}, lastsuccesssync
on e2k13

Answer 6

通过调用元素上的innerHTML属性，你正在做的假设，或者更具体地说，浏览器中的javascript引擎正在制作标签已经存在。但它不是这样，而是你得到预期的错误。无法阅读属性＆inner;内部HTML＆＃39;为null。正如@Quentin所建议的那样，正确的方法是实际查看您要求的元素是否存在。 if检查是truthy/falsy检查，它只是说如果元素对象存在，它将返回true，否则（即未定义）它将返回false。看看我的代码示例可能会让它更清晰一些。（easier to test on JSBIN）

<!DOCTYPE html>
<html>
<head>
   <title>Demonstrate ID exists tag checking</title>
</head>
<body>

  <!-- tag doesnt exist yet. Click button it creates a div.
  second time you click the button console message displayed. -->


  <button onclick="addDiv()">Add a div with id='tag exist'</button>

  <script>

  function addDiv() {

    if(document.getElementById("tag_exist")) {
      // do nothing div already exists  
      console.log("Div with id='tag_exists' already");
    } else {
     // append the div to body
     var div = document.createElement("div");
      div.setAttribute("id", "tag_exist")
      div.innerHTML = "I now exist";
      document.body.appendChild(div);
    }
 }

  </script>

</body>
</html>

html如何检查id是否存在元素？

6 个答案: