Проверьте, НЕ существует ли div с javascript

92

Проверить, существует ли div, довольно просто

if(document.getif(document.getElementById('if')){

}

Но как я могу проверить, не существует ли div с данным идентификатором?

javascript html if-statement

— Уилсон
источник

152

var myElem = document.getElementById('myElementId');
if (myElem === null) alert('does not exist!');

— Джимбо Джонни
источник

1

Большое спасибо. Я использую модальные окна AngularJS и Bootstrap, по какой-то причине JQuery не может найти элементы в модальном окне. Ванильный JS работал нормально.

— krex

75

if (!document.getElementById("given-id")) {
//It does not exist
}

Оператор document.getElementById("given-id")возвращается, nullесли элемент с given-idне существует, и nullявляется ложным, что означает, что он переводится в false при оценке в операторе if. ( другие ложные значения )

— Esailija
источник

4

Привет, Esailija, я считаю, что вы могли бы быть лучшим ответом, если бы вы добавили детали к тому, почему "!" работает хорошо. Возможно, говорят, что он возвращает null, что является ложью. +1 от меня.

— Alex KeySmith

4

Люди могли гуглить, что "!" означает в javascript или на многих других языках. Это не ракетостроение.

— CommandZ

7

@CommandZ: Зачем заставлять людей гуглить, если простое встроенное объяснение будет быстрее. Кроме того, я считаю, что Алекс имеет в виду то, что nullоценивает false, что не является общеизвестным (C # - это язык, где nullне равно false).

— Doug S

1

@DougS nullне составит falseдаже коэрцитивное сравнение на равенстве - вызова ToBoolean(null)возвращаетсяfalse

— Esailija

10

Попробуйте получить элемент с идентификатором и проверьте, равно ли возвращаемое значение null:

document.getElementById('some_nonexistent_id') === null

Если вы используете jQuery, вы можете:

$('#some_nonexistent_id').length === 0

— Христо
источник

2

Есть ли причина, по которой вы не можете просто сделать это !document.getElementById('foo')?

— Snuffleupagus

@ElatedOwl Может случиться так, что вы можете выполнить операцию со многими входами, и вы захотите проверить, существуют ли они. Тогда это было бы бессмысленно document.getElementById().

— Данон

10

Проверьте мой код JavaScript и JQuery:

JavaScript:

if (!document.getElementById('MyElementId')){
    alert('Does not exist!');
}

JQuery:

if (!$("#MyElementId").length){
    alert('Does not exist!');
}

— Чинмай235
источник

4

getElementByIdвозвращается, nullесли такого элемента нет.

— SLaks
источник

1

Это работает с:

 var element = document.getElementById('myElem');
 if (typeof (element) != undefined && typeof (element) != null && typeof (element) != 'undefined') {
     console.log('element exists');
 }
 else{
     console.log('element NOT exists');
 }

— Ema.H
источник

1

Есть даже лучшее решение. Вам даже не нужно проверять, возвращается ли элемент null. Вы можете просто сделать это:

if (document.getElementById('elementId')) {
  console.log('exists')
}

Этот код будет записываться existsна консоль только в том случае, если элемент действительно существует в DOM.

0

Я делаю это ниже и проверяю, idсуществует ли, и выполняю функцию, если она существует.

var divIDVar = $('#divID').length;
if (divIDVar === 0){ 
    console.log('No DIV Exist'); 
} else{  
    FNCsomefunction(); 
}

— Кибер
источник

0

Все эти ответы НЕ учитывают, что вы спросили конкретно об элементе DIV .

document.querySelector("div#the-div-id")

@ см. https://developer.mozilla.org/en-US/docs/Web/API/Document/querySelector

— sMyles
источник