blocks|key|944056|text|这应该适用于所有元素，无论它们是何时生成的。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|944057|if($('some_element').length+==+0)+{
}|code-block|syntax|javascript|944058|在ajax回调函数中编写代码，它应该可以很好地工作。|944059|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|L|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|M|8|@]|9|@]|A|$]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

This should work for all elements regardless of when they are generated.

<pre><code>if($('some_element').length == 0) {
}
</code></pre>

write your code in the ajax callback functions and it should work fine.

blocks|key|944365|text|这个问题是关于一个元素是否存在，所有答案都会检查它是否存在:)微小的差异，但值得一提的是。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|944366|基于jQuery+documentation，建议检查是否存在的方法是|offset|length|944367|if+($(+"#myDiv"+).length)+{
++++//+element+exists
}|code-block|syntax|javascript|944368|如果您希望检查缺少的元素，可以使用以下两种方法之一：|944369|if+(!$(+"#myDiv"+).length)+{
++++//+element+doesn't+exist
}|944370|或|944371|if+(0+===+$(+"#myDiv"+).length)+{
++++//+element+doesn't+exist
}|944372|请注意，在第二个选项中，我使用了比==略快的===，并将0放在左边作为Yoda+condition。|944373|entityMap|0|LINK|mutability|MUTABLE|url|https://learn.jquery.com/using-jquery-core/faq/how-do-i-test-whether-an-element-exists/|1|https://en.wikipedia.org/wiki/Yoda_conditions^0|0|2|K|0|0|0|0|0|0|0|Z|E|1|0^^$0|@$1|2|3|4|5|6|7|14|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|15|8|@]|9|@$D|16|E|17|1|18]]|A|$]]|$1|F|3|G|5|H|7|19|8|@]|9|@]|A|$I|J]]|$1|K|3|L|5|6|7|1A|8|@]|9|@]|A|$]]|$1|M|3|N|5|H|7|1B|8|@]|9|@]|A|$I|J]]|$1|O|3|P|5|6|7|1C|8|@]|9|@]|A|$]]|$1|Q|3|R|5|H|7|1D|8|@]|9|@]|A|$I|J]]|$1|S|3|T|5|6|7|1E|8|@]|9|@$D|1F|E|1G|1|1H]]|A|$]]|$1|U|3|-4|5|6|7|1I|8|@]|9|@]|A|$]]]|V|$W|$5|X|Y|Z|A|$10|11]]|12|$5|X|Y|Z|A|$10|13]]]]

This question is about whether an element exists and all answers check if it doesn't exist :) Minor difference but worth mentioning.

Based on <a href="https://learn.jquery.com/using-jquery-core/faq/how-do-i-test-whether-an-element-exists/" rel="noreferrer">jQuery documentation</a> the recommended way to check for existence is

<pre><code>if ($( "#myDiv" ).length) {
 // element exists
}
</code></pre>

If you prefer to check for missing element you could use either:

<pre><code>if (!$( "#myDiv" ).length) {
 // element doesn't exist
}
</code></pre>

or

<pre><code>if (0 === $( "#myDiv" ).length) {
 // element doesn't exist
}
</code></pre>

Note please that in the second option I've used === which is slightly faster than == and put the 0 on the left as a <a href="https://en.wikipedia.org/wiki/Yoda_conditions" rel="noreferrer">Yoda condition</a>.

blocks|key|728003|text|只是为了确认您以正确的方式选择了元素。试试这个|type|unstyled|depth|inlineStyleRanges|entityRanges|data|728004|if+($('#some_element').length+==+0)+{
++++//Add+it+to+the+dom
}|code-block|syntax|javascript|728005|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

Just to confirm that you are selecting the element in the right way. 
Try this one

<pre><code>if ($('#some_element').length == 0) {
 //Add it to the dom
}
</code></pre>

blocks|key|728058|text|如果ID可用，您可以使用getElementById()|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|728059|var+element+=++document.getElementById('elementId');
++if+(typeof(element)+!=+'undefined'+&&+element+!=+null)
++{+
+++++//+exists.
++}|code-block|syntax|javascript|728060|或者尝试使用Jquery+-|728061|if+($(document).find(yourElement).length+==+0)+
{+
+//+--+Not+Exist
}|728062|entityMap^0|2|2|C|G|0|0|0|0^^$0|@$1|2|3|4|5|6|7|Q|8|@$9|R|A|S|B|C]|$9|T|A|U|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|V|8|@]|D|@]|E|$I|J]]|$1|K|3|L|5|6|7|W|8|@]|D|@]|E|$]]|$1|M|3|N|5|H|7|X|8|@]|D|@]|E|$I|J]]|$1|O|3|-4|5|6|7|Y|8|@]|D|@]|E|$]]]|P|$]]

if <code>ID</code> is available - You can use <code>getElementById()</code> 

<pre><code>var element = document.getElementById('elementId');
 if (typeof(element) != 'undefined' &amp;&amp; element != null)
 { 
 // exists.
 }
</code></pre>

OR Try with Jquery - 

<pre><code>if ($(document).find(yourElement).length == 0) 
{ 
 // -- Not Exist
}
</code></pre>

blocks|key|728173|text|(()=>+{
++++var+elem+=+document.querySelector('.elem');++
++++(
++++++++(elem)+?+
++++++++console.log(elem%2B'+was+found.')+:
++++++++console.log('not+found')
++++)
})();|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|728174|如果它存在，它会将指定的元素作为DOM对象输出。对于JQuery+$('.elem')，它只告诉你如果找到了它就是一个对象，而不是哪个对象。|unstyled|offset|length|style|CODE|728175|entityMap^0|0|X|A|0^^$0|@$1|2|3|4|5|6|7|M|8|@]|9|@]|A|$B|C]]|$1|D|3|E|5|F|7|N|8|@$G|O|H|P|I|J]]|9|@]|A|$]]|$1|K|3|-4|5|F|7|Q|8|@]|9|@]|A|$]]]|L|$]]

<pre><code>(()=&gt; {
 var elem = document.querySelector('.elem'); 
 (
 (elem) ? 
 console.log(elem+' was found.') :
 console.log('not found')
 )
})();
</code></pre>

If it exists, it spits out the specified element as a DOM object. With JQuery <code>$('.elem')</code> it only tells you that it's an object if found but not which.

blocks|key|728139|text|在这种情况下，您可能需要检查当前DOM中是否存在元素|type|unstyled|depth|inlineStyleRanges|entityRanges|data|728140|如果您想要检查DOM树中是否存在元素(附加到DOM)，您可以使用：|728141|var+data+=+$('#data_1');+
if(jQuery.contains(document.documentElement,+data[0])){
++++//+#data_1+element+attached+to+DOM
}+else+{
++++//+is+not+attached+to+DOM
}|code-block|syntax|javascript|728142|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|L|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|M|8|@]|9|@]|A|$G|H]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

In this case, you may want to check if element exists in current DOM

if you want to check if element exist in DOM tree (is attached to DOM), you can use:

<pre><code>var data = $('#data_1'); 
if(jQuery.contains(document.documentElement, data[0])){
 // #data_1 element attached to DOM
} else {
 // is not attached to DOM
}
</code></pre>

blocks|key|728146|text|if+($('#some_element').length+===+0)+{
++++//If+exists+then+do+manipulations
}|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|728147|unstyled|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|G|8|@]|9|@]|A|$B|C]]|$1|D|3|-4|5|E|7|H|8|@]|9|@]|A|$]]]|F|$]]

<pre><code>if ($('#some_element').length === 0) {
 //If exists then do manipulations
}
</code></pre>

blocks|key|944304|text|不要比较任何东西，你可以通过这个简单地检查它...，。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|944305|if(document.getElementById("url")){+alert('exit');}
if($("#url")){alert('exist');}|code-block|syntax|javascript|944306|您还可以使用html()函数，如下所示|944307|if($("#url).html()){alert('exist');}|944308|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|N|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|O|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|P|8|@]|9|@]|A|$E|F]]|$1|K|3|-4|5|6|7|Q|8|@]|9|@]|A|$]]]|L|$]]

No to compare anything, you can simply check that by this...,.

<pre><code>if(document.getElementById("url")){ alert('exit');}
if($("#url")){alert('exist');}
</code></pre>

you can also use the html() function as well like

<pre><code>if($("#url).html()){alert('exist');}
</code></pre>

blocks|key|728309|text|还可以考虑使用|type|unstyled|depth|inlineStyleRanges|entityRanges|data|728310|$(document).ready(function()+{});|code-block|syntax|javascript|728311|不知道为什么这里还没有人想出这个(有点可悲)。你什么时候执行你的代码？刚开始的时候？然后你可能想要使用上面提到的ready()函数，这样你的代码就会在整个页面(包括它的dom元素)加载之后执行，而不是在加载之前！当然，如果您在页面加载后运行一些添加dom元素的代码，这是无用的！然后，您只需等待这些函数，然后执行您的代码...|728312|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|L|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|M|8|@]|9|@]|A|$]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

Also think about using

<pre><code>$(document).ready(function() {});
</code></pre>

Don't know why no one here came up with this yet (kinda sad). When do you execute your code??? Right at the start? Then you might want to use upper mentioned ready() function so your code is being executed after the whole page (with all it's dom elements) has been loaded and not before! Of course this is useless if you run some code that adds dom elements after page load! Then you simply want to wait for those functions and execute your code afterwards...

I am trying to add some form elements dynamically via Ajax with jQuery.
I want to make sure that I don't create the same element twice, so I only want to add it if it hasn't already been added to the DOM.

All of my elements have a unique CSS id, for example:

<pre><code>$('#data_1')
</code></pre>

I am using the following to check if the element already exists:

<pre><code>if ($('some_element').length == 0) {
 //Add it to the dom
}
</code></pre>

However, it only works for elements which were already part of the page when it first loaded. 

How do I also check for elements which were dynamically created after the page was loaded?

Any advice is appreciated.

Thanks.

jQuery - Check if DOM element already exists

jQuery

我正在尝试通过jQuery通过Ajax动态添加一些表单元素。我希望确保不会创建相同的元素两次，所以我只想添加尚未添加到DOM中的元素。我的所有元素都有一个唯一的CSS id，例如：$('#data_1')我使用以下代码来检查元素是否已经存在：if ($('some_element').length == 0) {    //Add it to the dom}但是，它只适用于第一次加载时已经是页面

问jQuery -检查DOM元素是否已存在
EN

回答 9

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问jQuery -检查DOM元素是否已存在EN

回答 9

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问jQuery -检查DOM元素是否已存在
EN