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

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


     28.03.2013    jquery, сниппет    JS Сниппеты    4065

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

23 комментария

Gopr
Юзер

Gopr - 21 июня 2013 20:06 -

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

ПафНутиЙ
Админ

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

Добавил демо

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

dj-avtosh
PHP-developer

dj-avtosh - 21 июня 2013 21:08 -

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

https://elkhan.ru
По заказам пишем сюда: @Rud00y

ЯД: 41001679231462
Заказы в telegram (ремонт модулей, оптимизация нагрузок и т.п.):
В телегу писать сразу задачу и бюджет.

Sander
PHP-developer

Sander - 22 июня 2013 12:55 -

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

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

Telegram: @sandev
Skype: Sander8804

TheImDim
Юзер

TheImDim - 22 июня 2013 13:12 -

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

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

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

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

ПафНутиЙ
Админ

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

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

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

TheImDim
Юзер

TheImDim - 22 июня 2013 14:18 -

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

ПафНутиЙ
Админ

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

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

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

dj-avtosh
PHP-developer

dj-avtosh - 23 июня 2013 15:42 -

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

https://elkhan.ru
По заказам пишем сюда: @Rud00y

ЯД: 41001679231462
Заказы в telegram (ремонт модулей, оптимизация нагрузок и т.п.):
В телегу писать сразу задачу и бюджет.

TheImDim
Юзер

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
Юзер

TheImDim - 23 июня 2013 15:59 -


TheImDim
Юзер

TheImDim - 21 июня 2013 21:35 -


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

Gopr
Юзер

Gopr - 21 июня 2013 22:57 -

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

ПафНутиЙ
Админ

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

видимо да.

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

dj-avtosh
PHP-developer

dj-avtosh - 22 июня 2013 10:57 -

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

https://elkhan.ru
По заказам пишем сюда: @Rud00y

ЯД: 41001679231462
Заказы в telegram (ремонт модулей, оптимизация нагрузок и т.п.):
В телегу писать сразу задачу и бюджет.

TheImDim
Юзер

TheImDim - 22 июня 2013 13:01 -

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

dj-avtosh
PHP-developer

dj-avtosh - 22 июня 2013 21:29 -

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

https://elkhan.ru
По заказам пишем сюда: @Rud00y

ЯД: 41001679231462
Заказы в telegram (ремонт модулей, оптимизация нагрузок и т.п.):
В телегу писать сразу задачу и бюджет.

ПафНутиЙ
Админ

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

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

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

TheImDim
Юзер

TheImDim - 23 июня 2013 12:52 -

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

dj-avtosh
PHP-developer

dj-avtosh - 23 июня 2013 13:48 -

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

https://elkhan.ru
По заказам пишем сюда: @Rud00y

ЯД: 41001679231462
Заказы в telegram (ремонт модулей, оптимизация нагрузок и т.п.):
В телегу писать сразу задачу и бюджет.

ПафНутиЙ
Админ

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

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

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

dj-avtosh
PHP-developer

dj-avtosh - 23 июня 2013 15:10 -

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

https://elkhan.ru
По заказам пишем сюда: @Rud00y

ЯД: 41001679231462
Заказы в telegram (ремонт модулей, оптимизация нагрузок и т.п.):
В телегу писать сразу задачу и бюджет.

dj-avtosh
PHP-developer

dj-avtosh - 23 июня 2013 00:33 -

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

https://elkhan.ru
По заказам пишем сюда: @Rud00y

ЯД: 41001679231462
Заказы в telegram (ремонт модулей, оптимизация нагрузок и т.п.):
В телегу писать сразу задачу и бюджет.

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