#javascript #html #dom
#javascript #HTML #dom
Вопрос:
Как я могу выбрать все <img> элементы, которые не находятся внутри <a> привязки, без каких-либо библиотек в ванильном JavaScript (без каких-либо библиотек)? Каков наиболее эффективный способ сделать это?
Комментарии:
1. Прямого нативного способа нет, так как нет родительских селекторов, и
:not()он реализован не полностью. Один из способов — создать массив всех изображений, а затем отфильтровать его, например, так:offLinkImgs = imgs.filter(img => !img.closest('a')).2. @Teemu Я подумал: в настоящее время not поддерживается довольно широко. Разве это не так? Это не родительский селектор, OP не хочет что-то делать с привязкой, содержащей изображение, но с изображениями, содержащимися в привязке
3. Поддерживается большинством популярных браузеров. Но да, это еще не полностью поддерживается менее популярными браузерами. Проверьте это на caniuse.
4. @LaurentS. Да, это так. Базовый
:not, вероятно, поддерживается довольно широко, но все свойства, которые он может содержать, еще не реализованы в браузерах. MDN говорит: » Возможность перечислять более одного селектора является экспериментальной и пока широко не поддерживается». И для этой задачи нам понадобится несколько селекторов:not, чтобы решить эту задачу.
Ответ №1:
Это оказалось действительно просто:
// Use CSS-like selector
const images = document.querySelectorAll(":not(a) > img");
// Foreach it
images.forEach((img) => {
// Use the img variable
}