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

2352

Как проверить наличие элемента в jQuery?

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

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

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

  • 0
    Я не знаю, что такое «не элегантный».
Теги:

40 ответов

2204
Лучший ответ

В JavaScript все "правдивое" или "ложное", а для чисел 0 (и NaN) означает false, все остальное true. Поэтому вы можете написать:

if ($(selector).length)

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

  • 6
    это вызовет ошибку, если вы используете селектор идентификатора, если элемент не существует. проверить различные тесты, которые я сделал ... в моем ответе
  • 41
    @ abhirathore2006 Если вы используете селектор идентификатора, а элемент не существует, длина равна 0 и не вызывает исключений.
Показать ещё 16 комментариев
1225

Да!

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

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

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

  • 248
    Я просто пишу: if ($ (селектор) .length) {...} без '> 0'
  • 355
    Ваш пример $.fn.exists заменяет поиск свойства (дешево!) Двумя вызовами функций, которые намного дороже, и один из этих вызовов функций воссоздает объект jQuery, который у вас уже есть, что просто глупо.
Показать ещё 9 комментариев
363

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

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 нет значений, то получение первого элемента в массиве возвращает undefined.

if ( $('#myDiv')[0] ) { /* Do something */ }
  • 10
    Первый способ читается лучше. $ ("a"). exist () читается как "если существуют элементы <a>." $ .exists ("a") читается как "если существуют элементы <a>."
  • 15
    правда, но опять же, вы подразумеваете, что связывание возможно, и если бы я попытался сделать что-то вроде $ (selector) .exists (). css ("color", "red"), это бы не сработало, и тогда я бы = * (
Показать ещё 8 комментариев
118

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

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

// if element does not exist
if(!$('selector').length){ /* do something */ }
  • 123
    Разве вы не видели, что Тим Бюте уже дал этот ответ за 2 года до вас?
  • 89
    Пфф, Тим никогда не показывал, как проверить, если элемент не существует.
Показать ещё 2 комментария
78

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

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

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

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

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

  • 51
    Совершенно не то же самое. Селекторы JQuery могут использоваться для любого правила CSS - например, $('#foo a.special') . И он может вернуть более одного элемента. getElementById не может начать приближаться к этому.
  • 7
    Вы правы в том, что это не так широко применимо, как селекторы. Тем не менее, он выполняет свою работу довольно хорошо в наиболее распространенном случае (проверка наличия единственного элемента). Аргументы самообъяснения и скорости все еще стоят.
Показать ещё 9 комментариев
56

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

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

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

  • 1
    Я пришел сюда, чтобы опубликовать этот точный ответ ... обязательная скрипка: jsfiddle.net/jasonwilczak/ekjj80gy/2
  • 3
    @JasonWilczak Не хотите прокомментировать, почему бы вместо этого: .eq [0] или .first () ссылаться на первый найденный элемент, а не на приведение типа?
Показать ещё 2 комментария
54

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

Plugin

;;(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

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

Имейте в виду, что использование варианта callback помогает поддерживать цепочку - возвращается элемент, и вы можете продолжать команды цепочки, как с любым другим методом 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    */
    }
})
  • 1
    На версии обратного вызова, не должен Has Items обратный вызов Has Items фактически передать объект в качестве аргумента?
54

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

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

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

  • 36
    Это слишком много для такой простой вещи. смотри Тим Бюте ответ
  • 0
    Это правильный ответ. Проблема метода length заключается в том, что он дает ложное срабатывание для любого числа, например: $ (666) .length // возвращает 1, но это недопустимый селектор
Показать ещё 3 комментария
50

Я вижу, что большинство ответов здесь не являются точными, как они должны быть, они проверяют длину элемента, во многих случаях это может быть нормально, но не на 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
47

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

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

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

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

  • 5
    Я знаю: он не отвечает непосредственно на исходный вопрос (который запрашивает функцию jquery), но в этом случае ответом будет «Нет» или «не семантически правильное решение».
40

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

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

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

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

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

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;

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

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);
31

Я обнаружил, что 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
  • 12
    Как часто вы вызываете $() с пустым объектом в качестве аргумента?
  • 0
    @nnnnnn На самом деле никогда (я больше не использую jQuery). Но, думаю, 3 года назад у меня был случай раскрытия API, который бы брал селектор и возвращал количество элементов для этого селектора. Если другой разработчик передаст пустой объект, он неправильно ответит 1.
Показать ещё 3 комментария
30

Является ли $.contains() тем, что вы хотите?

jQuery.contains( container, contained )

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

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

  • 3
    Это не принимает селектор, что означает, что он должен был бы выбрать его, что означает, что он мог просто проверить результат своего выбора.
29

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

// 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
}
  • 4
    Вам не нужно проверять, что длина погоды больше 0, если ($ ('# elementid'). Length) {} будет достаточно.
  • 13
    Вы на самом деле читали вопрос? Это точно такой же метод, который использует OP.
26

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

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

if ($(selector).exists()) {
    // the element exists, now what?...
}
  • 2
    Потому что Boolean(x) иногда может быть более эффективным.
26
$(selector).length && //Do something
  • 17
    Я ненавижу эти умные способы избегать использования if if улучшило бы читаемость за счет 2 байтов.
  • 0
    Кроме того, минифайеры сделают все это && для вас.
25

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

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

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

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

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

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

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

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

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

jQuery.contains берет два элемента 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 = "<tr><td>" + inputs[i][0] + "</td><td>"
          + testFuncs[0](input) + "</td><td>"
          + testFuncs[1](input) + "</td><td>"
          + testFuncs[2](input) + "</td></tr>";
    $("table").append(tr);
  }
td { border: 1px solid black }
<script src="/jquery.min.js"></script>
<div id="idoexist">#idoexist</div>
<table style>
<tr>
  <td>Input</td><td>!!$(sel)[0]</td><td>!!$(sel).length</td><td>$(sel).exists()</td>
</tr>
</table>
<script>
  
  $.fn.exists = function() {
    return $.contains(document.documentElement, this[0]); 
  }
  
</script>
20

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

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

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

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

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

$.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
  • 8
    Я нахожу оригинальный подход OP не только намного более минималистичным, но и более элегантным, чем этот. Похоже, излишне писать столько кода, когда метод OP короче и не требует обратных вызовов.
  • 0
    Для простых случаев - вы правы. Но для более сложных ситуаций, связанных с большим количеством кода в обоих случаях, я думаю, что мой подход лучше.
Показать ещё 1 комментарий
17

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

// 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;
};
16

Как насчет:

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

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

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

  • 3
    Это читается как «если существует вещь» вместо «если вещь существует», которая, if($("#thing").exists(){} читается как. Кроме того, это не способ jQuery.
12

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

    $.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/

11

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

if($("selector").length){
   //code in the case
} 
  • 5
    «дать массив» - нет, это не так. Он дает вам объект jQuery (который разделяет некоторые свойства с массивом). Ваш ответ по сути такой же, как и у Тима Бюте из 2009 года.
11

Вот мой любимый метод 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
    }
);
9

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

if($(selector).length){
  // true if length is not 0
} else {
  // false if length is 0
}
8
if ( $('#myDiv').size() > 0 ) { //do something }

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

  • 11
    @Furbeenator Я не знаю, откуда вы .size() информацию, но .size() ничего не делает, кроме как возвращает .length . Есть причина, по которой он устарел
  • 0
    Вы правы, но вызов .length , являющийся свойством, требует немного меньших затрат, чем вызов функции .size() . Виноват.
7

Вот полный пример различных ситуаций и способ проверить, существует ли элемент с помощью 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
  • 0
    Вы можете попробовать $ ("# xysyxxs") в своем отладчике, вы увидите, что jquery не возвращает null или undefined. Таким образом, окончательное решение не будет работать
7

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

В JQuery:

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

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

ИЛИ

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

От JavaScript:

if(document.getElementById("ElementID")) {
    //Do something...
}
  • 0
    если «ElementID» не существует, он не выдаст ошибку в условии if?
3

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

простой, короткий и удобный во всем проекте:

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

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

console.log( $("element-selector").isExists() );
  • 0
    Почему проголосовали ?? попробуйте и проголосуйте. Некоторые люди будут быстро DownVote, когда они не понимают себя! но я не удаляю свой ответ на использование другими программистами. Я всегда использую этот метод, и это абсолютно правильно.
  • 0
    Работает довольно хорошо на самом деле. Я бы порекомендовал назвать его просто «существует», так как «isExists» грамматически .... странно :). Я люблю короткие и сладкие.
3

Простая функция полезности для селектора id и класса.

   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");
                }

            });
        });
  • 4
    Таким образом, вы поместите его в глобальное пространство имен. Который вы можете пересмотреть.
2

Просто проверьте длину селектора, если он больше 0, тогда он возвращает true, иначе false.

Для удостоверения личности:

 if( $('#selector').length )         // use this if you are using id to check
{
     // it exists
}

Для класса:

 if( $('.selector').length )         // use this if you are using class to check
{
     // it exists
}

Для выпадающего списка:

if( $('#selector option').size() ) {   // use this if you are using dropdown size to check

   // it exists
}
2

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

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

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

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

Разъяснения

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

1

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

 if($("#element").length > 0){
     //the element exists in the page, you can do the rest....
    }

Это очень просто и легко найти элемент.

  • 0
    Ваш ответ не добавляет никакой новой информации к тому, что уже было опубликовано. Это всего лишь подмножество информации в принятом ответе .
-1

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

if($(selector).val())
-2

Используйте 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');
}
-4

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

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

Ещё вопросы

Сообщество Overcoder
Наверх
Меню