Есть ли "существует"? функция для jQuery?

Как я могу проверить существование элемента в jQuery?

Текущий код, который у меня есть, это:

if ($(selector).length > 0) {
    // Do something
}

Есть ли более элегантный способ подойти к этому? Возможно, плагин или функция?

вопрос задан 27.08.2008
Jake McGraw
32034 репутация

38 ответов

  • 0 рейтинг

    Вам не нужно проверять, больше ли оно 0, например $(selector).length > 0, $(selector).length, этого достаточно и это элегантный способ проверить наличие элементов. Я не думаю, что стоит написать функцию только для этого, если вы хотите сделать больше лишних вещей, да.

    if($(selector).length){
  // true if length is not 0
} else {
  // false if length is 0
}
    ответ дан Andrei Todorut, с репутацией 1809, 20.06.2017
  • 0 рейтинг

    Используйте querySelectorAll с forEach, нет необходимости в if и дополнительное назначение:

    document.querySelectorAll('.my-element').forEach((element) => {
  element.classList.add('new-class');
});

    как противоположность:

    const myElement = document.querySelector('.my-element');
if (myElement) {
  element.classList.add('new-class');
}
    ответ дан Rafal Enden, с репутацией 1360, 23.08.2018
  • 0 рейтинг

    Этот плагин можно использовать в операторе if, например, if ($(ele).exist()) { /* DO WORK */ }, или с помощью обратного вызова.

    Плагин

    ;;(function($) {
    if (!$.exist) {
        $.extend({
            exist: function() {
                var ele, cbmExist, cbmNotExist;
                if (arguments.length) {
                    for (x in arguments) {
                        switch (typeof arguments[x]) {
                            case 'function':
                                if (typeof cbmExist == "undefined") cbmExist = arguments[x];
                                else cbmNotExist = arguments[x];
                                break;
                            case 'object':
                                if (arguments[x] instanceof jQuery) ele = arguments[x];
                                else {
                                    var obj = arguments[x];
                                    for (y in obj) {
                                        if (typeof obj[y] == 'function') {
                                            if (typeof cbmExist == "undefined") cbmExist = obj[y];
                                            else cbmNotExist = obj[y];
                                        }
                                        if (typeof obj[y] == 'object' && obj[y] instanceof jQuery) ele = obj[y];
                                        if (typeof obj[y] == 'string') ele = $(obj[y]);
                                    }
                                }
                                break;
                            case 'string':
                                ele = $(arguments[x]);
                                break;
                        }
                    }
                }

                if (typeof cbmExist == 'function') {
                    var exist =  ele.length > 0 ? true : false;
                    if (exist) {
                        return ele.each(function(i) { cbmExist.apply(this, [exist, ele, i]); });
                    }
                    else if (typeof cbmNotExist == 'function') {
                        cbmNotExist.apply(ele, [exist, ele]);
                        return ele;
                    }
                    else {
                        if (ele.length <= 1) return ele.length > 0 ? true : false;
                        else return ele.length;
                    }
                }
                else {
                    if (ele.length <= 1) return ele.length > 0 ? true : false;
                    else return ele.length;
                }

                return false;
            }
        });
        $.fn.extend({
            exist: function() {
                var args = [$(this)];
                if (arguments.length) for (x in arguments) args.push(arguments[x]);
                return $.exist.apply($, args);
            }
        });
    }
})(jQuery);

    jsFiddle

    Вы можете указать один или два обратных вызова. Первый сработает, если элемент существует, второй сработает, если элемент не существует, а существует. Однако, если вы решите передать только одну функцию, она сработает только тогда, когда элемент существует. Таким образом, цепь умрет, если выбранный элемент не существует . Конечно, если она существует, первая функция сработает и цепочка продолжится.

    Имейте в виду, что использование варианта обратного вызова помогает поддерживать цепочечность - элемент возвращается, и вы можете продолжить цепочку команд, как с любым другим методом jQuery!

    Пример использует

    if ($.exist('#eleID')) {    /*    DO WORK    */ }        //    param as STRING
if ($.exist($('#eleID'))) { /*    DO WORK    */ }        //    param as jQuery OBJECT
if ($('#eleID').exist()) {  /*    DO WORK    */ }        //    enduced on jQuery OBJECT

$.exist('#eleID', function() {            //    param is STRING && CALLBACK METHOD
    /*    DO WORK    */
    /*    This will ONLY fire if the element EXIST    */
}, function() {            //    param is STRING && CALLBACK METHOD
    /*    DO WORK    */
    /*    This will ONLY fire if the element DOES NOT EXIST    */
})

$('#eleID').exist(function() {            //    enduced on jQuery OBJECT with CALLBACK METHOD
    /*    DO WORK    */
    /*    This will ONLY fire if the element EXIST    */
})

$.exist({                        //    param is OBJECT containing 2 key|value pairs: element = STRING, callback = METHOD
    element: '#eleID',
    callback: function() {
        /*    DO WORK    */
        /*    This will ONLY fire if the element EXIST    */
    }
})
    ответ дан SpYk3HH, с репутацией 18989, 9.11.2012
  • 0 рейтинг

    Вы можете проверить наличие элемента или не использовать длину в сценарии Java. Если длина больше нуля, то элемент присутствует, если длина равна нулю, то элемента нет

    // These by Id
if( $('#elementid').length > 0){
  // Element is Present
}else{
  // Element is not Present
}

// These by Class
if( $('.elementClass').length > 0){
  // Element is Present
}else{
  // Element is not Present
}
    ответ дан Anurag Deokar, с репутацией 628, 9.07.2015
  • 0 рейтинг

    Вдохновленный ответом hiway Я придумал следующее:

    $.fn.exists = function() {
    return $.contains( document.documentElement, this[0] );
}

    jQuery. Содержит , принимает два элемента DOM и проверяет, содержит ли первый элемент второй.

    Использование document.documentElement в качестве первого аргумента соответствует семантике метода exists, когда мы хотим применить его исключительно для проверки существования элемента в текущем документе.

    Ниже я собрал фрагмент, который сравнивает jQuery.exists() с подходами $(sel)[0] и $(sel).length, которые оба возвращают значения truthy для $(4), в то время как $(4).exists() возвращает false. В контексте проверки на наличие элемента в DOM это, кажется, желаемый результат .

    $.fn.exists = function() {
    return $.contains(document.documentElement, this[0]); 
  }
  
  var testFuncs = [
    function(jq) { return !!jq[0]; },
    function(jq) { return !!jq.length; },
    function(jq) { return jq.exists(); },
  ];
    
  var inputs = [
    ["$()",$()],
    ["$(4)",$(4)],
    ["$('#idoexist')",$('#idoexist')],
    ["$('#idontexist')",$('#idontexist')]
  ];
  
  for( var i = 0, l = inputs.length, tr, input; i < l; i++ ) {
    input = inputs[i][1];
    tr = "
    "; $("table").append(tr); } 
    td { border: 1px solid black }
    #idoexist
    

    

    
" + inputs[i][0] + "
" + testFuncs[0](input) + "
" + testFuncs[1](input) + "
" + testFuncs[2](input) + "

    

    

    

    
Input
!!$(sel)[0]
!!$(sel).length
$(sel).exists()

    

    


    

            
    

        
    ответ дан Oliver, с репутацией 6408, 13.10.2015
    
    
    

    • 

  • 


    
    
    
        
    0 рейтинг
    
    
    

    
    
        
    
            
    Самый быстрый и наиболее семантически понятный способ проверки существования на самом деле - использование простого JavaScript:
    

    if (document.getElementById('element_id')) {
    // Do something
}

    

    Запись немного длиннее, чем альтернатива длины jQuery, но выполняется быстрее, поскольку это собственный метод JS.
    

    И это лучше, чем альтернатива написания собственной функции jQuery. Эта альтернатива медленнее, по причинам, указанным @snover. Но это также создало бы у других программистов впечатление, что функция exist () является чем-то присущим jQuery. JavaScript будут / должны быть поняты другими, редактирующими ваш код, без увеличения долга знаний.
    

    NB: обратите внимание на отсутствие символа # перед element_id (так как это обычный JS, а не jQuery).
            
    

        
    ответ дан Magne, с репутацией 10280, 11.01.2012
    
    
    

    • 

  • 


    
    
    
        
    0 рейтинг
    
    
    

    
    
        
    
            
    Как насчет:
    

    function exists(selector) {
    return $(selector).length;
}

if (exists(selector)) {
    // do something
}

    

    Это очень минимально и избавляет вас от необходимости каждый раз заключать селектор в $().
            
    

        
    ответ дан GSTAR, с репутацией 1495, 4.03.2014
    
    
    

    • 

  • 


    
    
    
        
    0 рейтинг
    
    
    

    
    
        
    
            
    Вот мой любимый метод exist в jQuery
    

    $.fn.exist = function(callback) {
    return $(this).each(function () {
        var target = $(this);

        if (this.length > 0 && typeof callback === 'function') {
            callback.call(target);
        }
    });
};

    

    и другая версия, которая поддерживает обратный вызов, когда селектор не существует
    

    $.fn.exist = function(onExist, onNotExist) {
    return $(this).each(function() {
        var target = $(this);

        if (this.length > 0) {
            if (typeof onExist === 'function') {
                onExist.call(target);
            }
        } else {
            if (typeof onNotExist === 'function') {
                onNotExist.call(target);
            }
        }
    });
};

    

    Пример:
    

    $('#foo .bar').exist(
    function () {
        // Stuff when '#foo .bar' exists
    },
    function () {
        // Stuff when '#foo .bar' does not exist
    }
);

            
    

        
    ответ дан ducdhm, с репутацией 1626, 8.03.2016
    
    
    

    • 

  • 


    
    
    
        
    0 рейтинг
    
    
    

    
    
        
    
            
    $(selector).length && //Do something

            
    

        
    ответ дан SJG, с репутацией 1563, 28.05.2012
    
    
    

    • 

  • 


    
    
    
        
    0 рейтинг
    
    
    

    
    
        
    
            
    Попробуйте проверить элемент DOM на элемент
    

    if (!!$(selector)[0]) // do stuff

            
    

        
    ответ дан guest271314, с репутацией 1, 9.08.2015
    
    
    

    • 

  • 


    
    
    
        
    0 рейтинг
    
    
    

    
    
        
    
            
    это очень похоже на все ответы, но почему бы не использовать оператор ! дважды, чтобы вы могли получить логическое значение:
    

    jQuery.fn.exists = function(){return !!this.length};

if ($(selector).exists()) {
    // the element exists, now what?...
}

            
    

        
    ответ дан Santiago Hernández, с репутацией 2906, 4.05.2015
    
    
    

    • 

  • 


    
    
    
        
    0 рейтинг
    
    
    

    
    
        
    
            
    Вы можете использовать это:
    

    jQuery.fn.extend({
    exists: function() { return this.length }
});

if($(selector).exists()){/*do something*/}

            
    

        
    ответ дан Amitābha, с репутацией 1567, 1.06.2013
    
    
    

    • 

  • 


    
    
    
        
    0 рейтинг
    
    
    

    
    
        
    
            
    Нет необходимости в jQuery. С простым JavaScript проще и семантически правильно проверить:
    

    if(document.getElementById("myElement")) {
    //Do something...
}

    

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

    jQuery действительно крутой, но не позволяйте чистому JavaScript падать в забвение. , ,
            
    

        
    ответ дан amypellegrini, с репутацией 869, 14.11.2011
    
    
    

    • 

  • 


    
    
    
        
    0 рейтинг
    
    
    

    
    
        
    
            
    Да!
    

    jQuery.fn.exists = function(){ return this.length > 0; }

if ($(selector).exists()) {
    // Do something
}

    

    Это в ответ на: подкаст Herding Code с Джеффом Этвудом
            
    

        
    ответ дан Jake McGraw, с репутацией 32034, 27.08.2008
    
    
    

    • 

  • 


    
    
    
        
    0 рейтинг
    
    
    

    
    
        
    
            
    Вы можете использовать:
    

    if ($(selector).is('*')) {
  // Do something
}

    

    маленький более элегантный, возможно.
            
    

        
    ответ дан Devon, с репутацией 4364, 17.09.2008
    
    
    

    • 

  • 


    
    
    
        
    0 рейтинг
    
    
    

    
    
        
    
            
    Я обнаружил, что if ($(selector).length) {} недостаточно. Это будет молча сломать ваше приложение, когда selector является пустым объектом {}.
    

    var $target = $({});        
console.log($target, $target.length);

// Console output:
// -------------------------------------
// [▼ Object              ] 1
//    ► __proto__: Object

    

    Мое единственное предложение - выполнить дополнительную проверку для {}.
    

    if ($.isEmptyObject(selector) || !$(selector).length) {
    throw new Error('Unable to work with the given selector.');
}

    

    Я все еще ищу лучшее решение, хотя это немного тяжелый.
    

    Редактировать: ВНИМАНИЕ! Это не работает в IE, когда selector является строкой.
    

    $.isEmptyObject('hello') // FALSE in Chrome and TRUE in IE

            
    

        
    ответ дан Oleg, с репутацией 7299, 6.02.2012
    
    
    

    • 

  • 


    
    
    
        
    0 рейтинг
    
    
    

    
    
        
    
            
    Нет необходимости в jQuery
    

    if(document.querySelector('.a-class')) {
  // do something
}

            
    

        
    ответ дан Pawel, с репутацией 5298, 28.11.2016
    
    
    

    • 

  • 


    
    
    
        
    0 рейтинг
    
    
    

    
    
        
    
            
    if ( $('#myDiv').size() > 0 ) { //do something }

    

    size() подсчитывает количество элементов, возвращаемых селектором
            
    

        
    ответ дан Jon Erickson, с репутацией 72683, 25.02.2009
    
    
    

    • 

  • 


    
    
    
        
    0 рейтинг
    
    
    

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

    $.fn.exists = function(callback) {
    var self = this;
    var wrapper = (function(){
            function notExists () {}

            notExists.prototype.otherwise = function(fallback){
                if (!self.length) {                    
                    fallback.call();
                }
            };

            return new notExists;
        })();

    if(self.length) {
        callback.call();    
    }

    return wrapper;
}

    

    А теперь я могу написать такой код -
    

    $("#elem").exists(function(){
    alert ("it exists");
}).otherwise(function(){
    alert ("it doesn't exist");
});

    

    Может показаться, что кода много, но при написании на CoffeeScript он довольно мал:
    

    $.fn.exists = (callback) ->
    exists = @length
    callback.call() if exists        
    new class
       otherwise: (fallback) ->            
            fallback.call() if not exists

            
    

        
    ответ дан Eternal1, с репутацией 3857, 28.07.2014
    
    
    

    • 

  • 


    
    
    
        
    0 рейтинг
    
    
    

    
    
        
    
            
    Используйте следующий синтаксис, чтобы проверить, существует ли элемент на самом деле, используя jQuery.
    

    let oElement = $(".myElementClass");
if(oElement[0]) {
    // Do some jQuery operation here using oElement
}
else {
    // Unable to fetch the object
}

            
    

        
    ответ дан Jonathan Cardoz, с репутацией 147, 23.08.2016
    
    
    

    • 

  • 


    
    
    
        
    0 рейтинг
    
    
    

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

    if($(selector).get(0)) { // Do stuff }

    

    Или поручить вместо этого в начале вашей функции:
    

    if(!$(selector).get(0)) return;

    

    Объяснено
    

    В этом случае вам не нужно иметь дело с нулем | проблемы нулевой длины. Это заставляет выбирать элемент, а не считать их.
            
    

        
    ответ дан Jonas Lundman, с репутацией 343, 17.03.2018
    
    
    

    • 

  • 


    
    
    
        
    0 рейтинг
    
    
    

    
    
        
    
            
    Я использую это:
    

        $.fn.ifExists = function(fn) {
      if (this.length) {
        $(fn(this));
      }
    };
    $("#element").ifExists( 
      function($this){
        $this.addClass('someClass').animate({marginTop:20},function(){alert('ok')});               
      }
    ); 

    

    Выполнять цепочку, только если существует элемент jQuery - http: // jsfiddle. net / andres_314 / vbNM3 / 2/
            
    

        
    ответ дан andy_314, с репутацией 199, 1.08.2012
    
    
    

    • 

  • 


    
    
    
        
    0 рейтинг
    
    
    

    
    
        
    
            
    $("selector") дать объект, который имеет length данных. Если в селекторе есть элементы, которые вы определили, вы получите их от объекта. Поэтому, если вы проверите его длину, вы уже можете найти, существует ли какой-либо элемент. В javascript 0 == false также null == false. Если вы не получите 0, ваши коды будут работать.
    

    if($("selector").length){
   //code in the case
} 

            
    

        
    ответ дан Kamuran Sönecek, с репутацией 1690, 25.03.2016
    
    
    

    • 

  • 


    
    
    
        
    0 рейтинг
    
    
    

    
    
        
    
            
    Вот полный пример различных ситуаций и способа проверить, существует ли элемент, используя direct, если на jQuery селектор может или не может работать, потому что он возвращает массив или элементы.
    

    var a = null;

var b = []

var c = undefined ;

if(a) { console.log(" a exist")} else { console.log("a doesn't exit")}
// output: a doesn't exit

if(b) { console.log(" b exist")} else { console.log("b doesn't exit")}
// output: b exist

if(c) { console.log(" c exist")} else { console.log("c doesn't exit")}
// output: c doesn't exit

    

    ЗАКЛЮЧИТЕЛЬНОЕ РЕШЕНИЕ
    

    if($("#xysyxxs").length){ console.log("xusyxxs exist")} else { console.log("xusyxxs doesnn't exist") }
//output : xusyxxs doesnn't exist

if($(".xysyxxs").length){ console.log("xusyxxs exist")} else { console.log("xusyxxs doesnn't exist") }
    //output : xusyxxs doesnn't exist

            
    

        
    ответ дан abhirathore2006, с репутацией 2089, 31.07.2016
    
    
    

    • 

  • 


    
    
    
        
    0 рейтинг
    
    
    

    
    
        
    
            
    Попробуйте это.
    

    , простые и , короткие и , используемые во всем проекте :
    

    jQuery.fn.isExists=function(){return !!this[0];}; //jQuery Plugin

    

    Использование:
    

    console.log( $("element-selector").isExists() );

            
    

        
    ответ дан Hassan Sadeghi, с репутацией 783, 18.08.2018
    
    
    

    • 

  • 


    
    
    
        
    0 рейтинг
    
    
    

    
    
        
    
            
    В JavaScript все «правдиво» или «ложно», а для чисел 0 (и NaN) означает false, все остальное true. Таким образом, вы могли бы написать:
    

    if ($(selector).length)

    

    Вам не нужна эта >0 часть.
            
    

        
    ответ дан Tim Büthe, с репутацией 46200, 25.02.2009
    
    
    

    • 

  • 


    
    
    
        
    0 рейтинг
    
    
    

    
    
        
    
            
    Я вижу, что большинство ответов здесь не точны , как они должны быть, они проверяют длину элемента, это может быть хорошо во многих случаях, но не 100%, представьте, что вместо функции передается число, поэтому я создаю прототип функции которые проверяют все условия и возвращают ответ так, как должно быть:
    

    $.fn.exists = $.fn.exists || function() { 
  return !!(this.length && (this[0] instanceof HTMLDocument || this[0] instanceof HTMLElement)); 
}

    

    Это проверит длину и тип, теперь вы можете проверить это следующим образом:
    

    $(1980).exists(); //return false
$([1,2,3]).exists(); //return false
$({name: 'stackoverflow', url: 'http://www.stackoverflow.com'}).exists(); //return false
$([{nodeName: 'foo'}]).exists() // returns false
$('div').exists(); //return true
$('.header').exists(); //return true
$(document).exists(); //return true
$('body').exists(); //return true

            
    

        
    ответ дан Alireza, с репутацией 39782, 20.05.2017
    
    
    

    • 

  • 


    
    
    
        
    0 рейтинг
    
    
    

    
    
        
    
            
    Проверка наличия элемента тщательно документирована на самом официальном сайте jQuery!
    

    

    Используйте . length свойство коллекции jQuery, возвращенной вашим селектор:
    

    if ($("#myDiv").length) {
    $("#myDiv").show();
}

    

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

    $("#myDiv").show();

            
    

        
    ответ дан Tilak Maddy, с репутацией 1388, 22.03.2017
    
    
    

    • 

  • 


    
    
    
        
    0 рейтинг
    
    
    

    
    
        
    
            
    Простая служебная функция для идентификатора и селектора класса.
    

       function exist(IdOrClassName, IsId) {
        var elementExit = false;
        if (IsId) {
            elementExit= $("#" + "" + IdOrClassName + "").length ? true : false;
        }
        else {
                elementExit = $("." + "" + IdOrClassName + "").length ? true : false;
        }
        return elementExit;
    } 

    

    вызывая эту функцию, как показано ниже
    

        $(document).ready(function () {
            $("#btnCheck").click(function () {
//address is the id so IsId is true. if address is class then need to set IsId false
                if (exist("address", true)) {
                    alert("exist");
                }
                else {
                    alert("not exist");
                }

            });
        });

            
    

        
    ответ дан sina_Islam, с репутацией 360, 16.10.2017
    
    
    

    • 

  • 


    
    
    
        
    0 рейтинг
    
    
    

    
    
        
    
            
    составляет $. содержит () что вы хотите?
    

    

    jQuery. содержит (контейнер, содержится)
    

    $. Метод contains () возвращает true, если элемент DOM, предоставленный вторым аргументом, является потомком элемента DOM, предоставленного первым аргументом, является ли он прямым потомком или вложенным более глубоко. В противном случае возвращается false. Поддерживаются только узлы элементов; если второй аргумент является узлом текста или комментария, $. Содержит () вернет ложь.
    

    Примечание : Первый аргумент должен быть элементом DOM, а не объектом jQuery или обычным объектом JavaScript.
    

            
    

        
    ответ дан hiway, с репутацией 1915, 23.10.2013
    
    
    

    • 

  • 


    
    
    
        
    0 рейтинг
    
    
    

    
    
        
    
            
    Вы можете использовать это:
    

    // if element exists
if($('selector').length){ /* do something */ }

    

    

    // if element does not exist
if(!$('selector').length){ /* do something */ }

            
    

        
    ответ дан Yanni, с репутацией 1947, 3.04.2011
    
    
    

    • 

  • 


    
    
    
        
    0 рейтинг
    
    
    

    
    
        
    
            
    Мне просто нравится использовать простой ванильный JavaScript для этого.
    

    function isExists(selector){
  return document.querySelectorAll(selector).length>0;
}

            
    

        
    ответ дан Sanu Uthaiah Bollera, с репутацией 580, 18.06.2016
    
    
    

    • 

  • 


    
    
    
        
    0 рейтинг
    
    
    

    
    
        
    
            
    Да Лучший способ сделать это:
    

    JQuery:
    

    if($("selector").length){
   //code in the case
}

    

    selector может быть Element ID ИЛИ Element Class
    

    ИЛИ
    

    Если вы не хотите использовать библиотеку jQuery, вы можете добиться этого с помощью Core JavaScript:
    

    By JavaScript:
    

    if(document.getElementById("ElementID")) {
    //Do something...
}

            
    

        
    ответ дан Sunil Kumar, с репутацией 1620, 26.07.2016
    
    
    

    • 

  • 


    
    
    
        
    0 рейтинг
    
    
    

    
    
        
    
            
    Вы можете сохранить несколько байтов, написав:
    

    if ($(selector)[0]) { ... }

    

    Это работает, потому что каждый объект jQuery также маскируется под массив, поэтому мы можем использовать оператор разыменования массива, чтобы получить первый элемент из массива . Возвращает undefined, если в указанном индексе нет элемента.
            
    

        
    ответ дан Salman A, с репутацией 165526, 18.01.2014
    
    
    

    • 

  • 


    
    
    
        
    0 рейтинг
    
    
    

    
    
        
    
            
    Ввод не будет иметь значения, если он не существует. Попробуй это. , ,
    

    if($(selector).val())

            
    

        
    ответ дан Manish Vadher, с репутацией 424, 16.08.2018
    
    
    

    • 

  • 


    
    
    
        
    0 рейтинг
    
    
    

    
    
        
    
            
    Причина, по которой все предыдущие ответы требуют параметра .length, заключается в том, что они в основном используют селектор $() jquery, который имеет querySelectorAll за занавесом (или они используют его напрямую). Этот метод довольно медленный, потому что ему нужно проанализировать все дерево DOM, отыскивая всех совпадений с этим селектором и заполняя ими массив.
    

    Параметр ['length'] не нужен или не полезен, и код будет намного быстрее, если вместо этого вы напрямую используете document.querySelector(selector), поскольку он возвращает первый соответствующий элемент или ноль, если не найден.
    

    function elementIfExists(selector){  //named this way on purpose, see below
    return document.querySelector(selector);
}
/* usage: */
var myelement = elementIfExists("#myid") || myfallbackelement;

    

    Однако этот метод оставляет нас с фактическим возвращаемым объектом; что хорошо, если он не будет сохраняться как переменная и использоваться повторно (таким образом, сохраняя ссылку, если мы забудем).
    

    var myel=elementIfExists("#myid");
// now we are using a reference to the element which will linger after removal
myel.getParentNode.removeChild(myel);
console.log(elementIfExists("#myid")); /* null */
console.log(myel); /* giant table lingering around detached from document */
myel=null; /* now it can be garbage collected */

    

    В некоторых случаях это может быть желательно. Может использоваться в цикле for следующим образом:
    

    /* locally scoped myel gets garbage collected even with the break; */
for (var myel; myel = elementIfExist(sel); myel.getParentNode.removeChild(myel))
    if (myel == myblacklistedel) break;

    

    Если вам на самом деле не нужен элемент и вы хотите получить / сохранить только значение true / false, просто удвойте его! ! Это работает для обуви, которая развязана, так почему узел здесь?
    

    function elementExists(selector){
    return !!document.querySelector(selector);
}
/* usage: */
var hastables = elementExists("table");  /* will be true or false */
if (hastables){
    /* insert css style sheet for our pretty tables */
}
setTimeOut(function (){if (hastables && !elementExists("#mytablecss"))
                           alert("bad table layouts");},3000);

            
    

        
    ответ дан technosaurus, с репутацией 5807, 11.08.2014
    
    
    

    • 

  • 


    
    
    
        
    0 рейтинг
    
    
    

    
    
        
    
            
    Если вы использовали
    

    jQuery.fn.exists = function(){return ($(this).length > 0);}
if ($(selector).exists()) { }

    

    Вы бы подразумевали, что сцепление было возможно, когда это не так.
    

    Это было бы лучше:
    

    jQuery.exists = function(selector) {return ($(selector).length > 0);}
if ($.exists(selector)) { }

    

    Кроме того, из часто задаваемых вопросов :
    

    if ( $('#myDiv').length ) { /* Do something */ }

    

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

    if ( $('#myDiv')[0] ) { /* Do something */ }

            
    

        
    ответ дан Jon Erickson, с репутацией 72683, 14.01.2009
    
    
    

    • 

  • 


    
    
    
        
    0 рейтинг
    
    
    

    
    
        
    
            
    У меня был случай, когда я хотел посмотреть, существует ли объект внутри другого, поэтому я добавил что-то в первый ответ, чтобы проверить селектор внутри селектора. ,
    

    // Checks if an object exists.
// Usage:
//
//     $(selector).exists()
//
// Or:
// 
//     $(selector).exists(anotherSelector);
jQuery.fn.exists = function(selector) {
    return selector ? this.find(selector).length : this.length;
};

            
    

        
    ответ дан jcreamer898, с репутацией 6323, 5.04.2012
    
    
    

    •