javascript проверяет, существует ли элемент DOM

какова наилучшая практика проверки наличия элемента DOM в javascript?

следует ли проверять, существует ли элемент до его использования, например?

if ($("#" + machineId + packageId.removeSpecialChars().toUpperCase() + "").size() != 0) {
  var row = $("#" + machineId + packageId.removeSpecialChars().toUpperCase() + "");
}

не выполнять packageId.removeSpecialChars().toUpperCase() в два раза?

или это был бы лучший вариант?

var row = $("#" + machineId + packageId.removeSpecialChars().toUpperCase() + ""); 
if (row)
{
  // do something
}

однако, не будет ли это исключение, когда не найдено?

5 ответов


когда вы на самом деле работаете с элементами DOM, то да, вы должны проверить, что он существует, прежде чем пытаться работать с ним, чтобы избежать ошибок JavaScript. Тем не менее, вы не работая с элементами DOM, вы работаете с объектом jQuery, который (потенциально) содержит элементы DOM.

функции jQuery уже обрабатывают случаи, когда в его наборе элементов нет совпадений, поэтому вам не нужно явно проверять для себя, что есть элементы перед попытка работать с ними. Вам нужно только сделать это, если вы пытаетесь напрямую ссылаться на элементы DOM изнутри этого набора, используя


лучше кэшировать его:

var machId = $("#" + machineId + packageId.removeSpecialChars().toUpperCase());
if (machId.size() != 0) {
   var row = machId;
}

общие соглашения по программированию говорят не повторяйся. Таким образом, в этом случае вы могли бы по крайней мере сделать поиск вещи только один раз и сохранить ссылку на переменную:

var thing = $("#" + machineId + packageId.removeSpecialChars().toUpperCase() + "");

тогда поиск выбора не происходит дважды, избыточные вызовы методов удаляются и т. д. Это также позволяет вам писать более понятный код, когда вы можете назвать переменную чем-то значимым, кроме thing или еее!, a (хотя это не обязательно так, что код должен быть более значимым, люди еще используйте такие имена, как a!)

if (thing != null) { }
if (thing.size() != 0) {

} 
etc.

для вызова методов несколько раз, это неизбежно.


это делает, что вам нужно:

var a = $("#" + machineId + packageId.removeSpecialChars().toUpperCase() + "");
if (a.size()) {
    var row = a;
}

вам в основном нужно увидеть, существует ли элемент DOM в вашем HTML, но пиво имеет в виду, что jQuery не выдает фатальную ошибку, если элемент не существует в вашем DOM, но было бы хорошей практикой проверить, он добавляет еще один безопасный слой в вашем коде, было что-то вызвано .размер (), который устарел от версии 1.8, поэтому не рекомендуется использовать даже старую версию jQuery, поэтому лучшим решением на данный момент было бы что-то вроде кода ниже:

if($('.class').length) { // check if any element with this class exist, if not exist, it return 0 and can not pass the if estatement
    // do something
}