Не нравятся результаты поиска? Попробуйте другой поиск!
dle-faq.ru Сниппеты JS Сниппеты Проверка существования элемента на странице через jQuery

Проверка существования элемента на странице через jQuery


     28.03.2013    JS Сниппеты    2308

Простейший код, а избавляет от огромного кол-ва ошибок новичков))
if($('.yourElement').length > 0){
     //код будет работать, если блок с классом yourElement есть на странице
}
Демо

Комментарии пользователей (23)

Gopr
10

494 | 164

Gopr - 21 июня 2013 20:06 - Юзер

ПафНутиЙ можете привести пример применения скрипта? Непонятно как узнать об ошибках.

ПафНутиЙ
1064

3394 | 2433

ПафНутиЙ - 21 июня 2013 21:10 - Админ

Добавил демо

Каков вопрос - таков и ответ. Просто помните об этом.

dj-avtosh
39

1479 | 390

dj-avtosh - 21 июня 2013 21:08 - шашлычник

Все понятно. Измеряешь длину элемента и все.

skype: elhan.isaev

Sander
1125

1637 | 1204

Sander - 22 июня 2013 12:55 - Эксперт

Поправочка, $('.yourElement').length возвращает количество элементов на странице, а не длину ;)

SanDev.pro - мой блог.

ICQ: 404-037-556
Skype: Sander8804

TheImDim
18

327 | 291

TheImDim - 22 июня 2013 13:12 - Юзер

$('.yourElement').length
Возвращает длину массива с данными элементами, если этого массива не существует
if($('.yourElement').length > 0)

то и длина его равна нулю

Также в приведенном мною примере проверяется существование первого элемента массива
if( $('.yourElement')[0] )

и если его не существует, условие возвращает false

ПафНутиЙ
1064

3394 | 2433

ПафНутиЙ - 22 июня 2013 13:35 - Админ

length-vs-selector
Мне думается правильнее использовать $('.yourElement').length без > 0 т.к. это уточнение лишнее.
Опять же слово length нагляднее чем [0] и работает быстреее, хоть и нестолько незначительно, что заметно лишь на больших кол-вах проверок.
А вообще на вкус и цвет фломатеры разные.

Каков вопрос - таков и ответ. Просто помните об этом.

TheImDim
18

327 | 291

TheImDim - 22 июня 2013 14:18 - Юзер

Согласен, но о таких мелочах думаю можно не задумываться, ведь разницы не будет видно вообще. Примерно при 100 000 таких проверок разница будет составлять в 20-40 милисекунд.

ПафНутиЙ
1064

3394 | 2433

ПафНутиЙ - 22 июня 2013 14:20 - Админ

угу, если не меньше))
А вообще это как вопрос что писать $('slector') или jQuery('selector') можно спорить до бесконечности)

Каков вопрос - таков и ответ. Просто помните об этом.

dj-avtosh
39

1479 | 390

dj-avtosh - 23 июня 2013 15:42 - шашлычник

И кстати при чем тут false??? Когда undefined.

skype: elhan.isaev

TheImDim
18

327 | 291

TheImDim - 23 июня 2013 15:54 - Юзер

В php при включении ошибок и отсутствии элемента - при такой проверке - выпал бы Notice.

Не надо сравнивать php и javascript

И кстати при чем тут false??? Когда undefined.


because


undefined

If a variable hasn't been declared or assigned yet (an argument to a function which never received a value, an object property that hasn't been assigned a value) then that variable will be given a special undefined value.

Evaluates to false in boolean operations. Always use === when comparing to undefined.

TheImDim
18

327 | 291

TheImDim - 23 июня 2013 15:59 - Юзер


TheImDim
18

327 | 291

TheImDim - 21 июня 2013 21:35 - Юзер


if( $('.yourElement')[0] ){
     //код будет работать, если блок с классом yourElement есть на странице
}

Gopr
10

494 | 164

Gopr - 21 июня 2013 22:57 - Юзер

Ясно я видемо не так понял назначение скрипта :)

ПафНутиЙ
1064

3394 | 2433

ПафНутиЙ - 22 июня 2013 10:46 - Админ

видимо да.

Каков вопрос - таков и ответ. Просто помните об этом.

dj-avtosh
39

1479 | 390

dj-avtosh - 22 июня 2013 10:57 - шашлычник

TheImDim,
Обращаться по цифровому ключу для проверки элемента, мягко говоря гавнокод.

skype: elhan.isaev

TheImDim
18

327 | 291

TheImDim - 22 июня 2013 13:01 - Юзер

аргументируй

dj-avtosh
39

1479 | 390

dj-avtosh - 22 июня 2013 21:29 - шашлычник

Это костыль, что ещё тут аргументировать. Это нехороший подход к решению задачи.

skype: elhan.isaev

ПафНутиЙ
1064

3394 | 2433

ПафНутиЙ - 22 июня 2013 21:39 - Админ

Какой подход тогда правильный? smile

Каков вопрос - таков и ответ. Просто помните об этом.

TheImDim
18

327 | 291

TheImDim - 23 июня 2013 12:52 - Юзер

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

dj-avtosh
39

1479 | 390

dj-avtosh - 23 июня 2013 13:48 - шашлычник

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

skype: elhan.isaev

ПафНутиЙ
1064

3394 | 2433

ПафНутиЙ - 23 июня 2013 14:47 - Админ

Ну вот к примеру у тебя на произвольной странице должна быть карусель из картинок, где она должна быть - заранее не известно, поэтому её инициализация (с парамертами, передаваемыми из самой карусели при её появлении на странице) находится в общем js-файле. Однако если карусели нет, инициализация выдаст ошибку и js дальше не бдет обрабатываться. Проверка решает эту проблему и по большому счёту способ проверки не важен.

Каков вопрос - таков и ответ. Просто помните об этом.

dj-avtosh
39

1479 | 390

dj-avtosh - 23 июня 2013 15:10 - шашлычник

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

skype: elhan.isaev

dj-avtosh
39

1479 | 390

dj-avtosh - 23 июня 2013 00:33 - шашлычник

Который указал ты - самый верный.

skype: elhan.isaev

Чтобы комментировать - войдите или зарегистрируйтесь на сайте