jQuery - Перевірте, чи вже існує елемент DOM

Я намагаюся динамічно додавати деякі елементи форми через Ajax за допомогою jQuery. Я хочу переконатися, що не створюю один і той же елемент двічі, тому додаю його лише в тому випадку, якщо він ще не був доданий до DOM.

Усі мої елементи мають унікальний ідентифікатор CSS, наприклад:

$('#data_1')

Я використовую наступне, щоб перевірити, чи вже існує елемент:

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

Однак він працює лише для елементів, які вже були частиною сторінки при її першому завантаженні.

Як мені також перевірити наявність елементів, які були динамічно створені після завантаження сторінки?

Будь-яка порада буде вдячна.

Дякую.

Це має працювати для всіх елементів, незалежно від того, коли вони створені.

if($('some_element').length == 0) {
}

напишіть свій код у функції зворотного виклику ajax, і він повинен працювати нормально.

Це питання стосується того, чи існує елемент, і всі відповіді перевіряють, чи не існує :) Незначна різниця, але варта згадки.

На основі документації jQuery рекомендується перевірити наявність

if ($( "#myDiv" ).length) {
    // element exists
}

Якщо ви віддаєте перевагу перевіряти відсутність елемента, ви можете скористатися одним із таких варіантів:

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

або

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

Зверніть увагу, що у другому варіанті я використав ===, який трохи швидший, ніж ==, і поставив 0 зліва як умову Йоди .

Тільки для підтвердження того, що ви правильно вибрали елемент. Спробуйте це

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

Здається, ви забули додати елемент до DOM.

Перевірте ТУТ .

якщо IDє - Ви можете використовуватиgetElementById()

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

АБО Спробуйте за допомогою Jquery -

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

(()=> {
    var elem = document.querySelector('.elem');  
    (
        (elem) ? 
        console.log(elem+' was found.') :
        console.log('not found')
    )
})();

Якщо він існує, він видає вказаний елемент як об'єкт DOM. За допомогою JQuery $('.elem')він повідомляє вам, що це об'єкт, якщо він знайдений, але не який.

У цьому випадку ви можете перевірити, чи існує елемент у поточному DOM

якщо ви хочете перевірити, чи існує елемент у дереві DOM (приєднаний до DOM), ви можете використовувати:

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

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

Ні для порівняння нічого, ви можете просто перевірити, що за допомогою цього ...,.

if(document.getElementById("url")){ alert('exit');}
if($("#url")){alert('exist');}

Ви також можете використовувати функцію html ()

if($("#url).html()){alert('exist');}

Також подумайте про використання

$(document).ready(function() {});

Не знаю, чому ще ніхто тут цього не придумав (певно сумно). Коли ви виконуєте свій код ??? На початку? Тоді ви можете використати верхню згадану функцію ready (), щоб ваш код виконувався після завантаження цілої сторінки (з усіма елементами dom), а не раніше! Звичайно, це марно, якщо ви запускаєте якийсь код, який додає елементи dom після завантаження сторінки! Тоді ви просто хочете дочекатися цих функцій і виконати свій код згодом ...