javascript - How to check if an element with id exists or not in jQuery?

Question

I'm generating a div dynamically and I've to check whether a dynamically generated div exists or not ? How can I do that?

Currently I'm using the following which does not detects the div generated dynamically. It only detects if there is already an element with the id contained in the HTML template.

$(function() {
    var $mydiv = $("#liveGraph_id");
    if ($mydiv.length){
        alert("HHH");
    }
});

How can I detect the dynamically generated div?

Answer 1

如果由于浏览器兼容性而无法选择突变观察，则您必须涉及将实际<div>插入document.

一种选择是将自定义事件用作pub/sub。

$(document).on('document_change', function () {
    if (document.getElementById('liveGraph_id')) {
        // do what you need here
    }
});

// without a snippet to go on, assuming `.load()` for an example
$('#container').load('/path/to/content', function () {
    $(this).trigger('document_change');
});

Answer 2

如果是动态添加的，则必须再次测试。比方说，一个点击事件

$("#element").click(function()
{
    if($("#liveGraph_id").length)
        alert("HHH");
});

Answer 3

只是出于兴趣，您还可以为此使用实时集合（它们作为 DOM 的一部分提供）。您可以在页面中设置所有 div 的集合（这甚至可以在加载正文之前在头部完成）：

var allDivs = document.getElementsByTagName('div');

任何具有 id 的 div 都可用作集合的命名属性，因此您可以执行以下操作：

if (allDivs.someId) {
  // div with someId exists
}

如果 ID 不是有效标识符，或者它保存在变量中，请使用方括号表示法。一些播放代码：

<button onclick="
  alert(!!allDivs.newDiv);
">Check for div</button>
<button onclick="
  var div = document.createElement('div');
  div.id = 'newDiv';
  document.body.appendChild(div);
">Add div</button>

单击检查 div按钮，您将获得false. 通过单击Add div按钮添加 div 并再次检查 - 你会得到true.

Answer 4

您如何插入动态生成的 div？

如果您按以下方式执行此操作，它会起作用：

var div = document.createElement('div');
div.id = 'liveGraph_id';
div.innerHTML = "i'm dynamic";
document.getElementsByTagName('body')[0].appendChild(div);
if ($(div).length > 0) {
    alert('exists'); //will give alert
}
if ($('#liveGraph_id').length > 0) {
    alert('exists'); //will give alert
}
if ($('#liveGraph_id_extra').length > 0) {
    alert('exists'); //wont give alert because it doesn't exist.
}

jsfiddle。

Answer 5

就这么简单

   if(document.getElementById("idname")){
//div exists 

}

或者

    if(!document.getElementById("idname")){
//  don't exists
}