Помощник
Здравствуйте, гость ( Вход | Регистрация )
Объявления
STool - Программа коррекции одометров (via Diagnosis) - FVDI 2014-2015 активация дополнительных коммандеров - Диагностика LR/Jaguar - активации SDD в оффлан режиме, генерации паролей - Диагностика Ford/Mazda, решение по Ford IDS Будет работать до 2020г - Раскодировка Магнитол Форд Vxxxxxx, Практически OnLine - Активация XEntry/WIS/EPC последних версий - Launch EasyDiag, Активация марок EOBD 22.46-22.47
|
 28.4.2016, 23:04
Сообщение
#226103
|
|
 Special Группа: Главные администраторы Сообщений: 13275 Спасибо сказали: 2042 раза  |
querySelectorAll()
Описание elementList = baseElement.querySelectorAll(selectors); querySelectorAll() может быть вызвана для любого элемента (baseElement). elementList - Будет содержать NodeList, если элементы были найдены. selectors - строка, содержащая, через запятую, один или более CSS селектор. Строка указанная в качестве текста селектора, должна соответствовать синтаксису CSS Помните, что возвращённый в качестве результата список NodeList не рекомендуется для использования в циклах for...in или for each...in в качестве массива, т.к., это не массив в «традиционном» понятии Javascript, а объект типа NodeList, который, хоть и схож по свойствам с массивом, но не является таковым в полной мере (не поддерживает все методы, доступные массиву), так что будьте осторожны. Не следует использовать конструкции for...in или for each...in для перечисления элементов списка. Эти способы также перечислят и свойства length и item, что приведёт к логическим ошибкам в случае, если скрипт ожидает только объекты element. Также for..in может перечислять свойства в любом порядке. Элементы в NodeList, можно обработать следующим образом: CODE for (var i = 0; i < myNodeList.length; ++i) { var item = myNodeList[i]; // Вызов myNodeList.item(i) необязателен в JavaScript } Стандартное поведение. При указании имени классов нужно ставить впереди имени класса точку. Если указываете несколько классов, то поиск производится по вариантам: 1. По принципу логического ИЛИ (OR), для этого необходимо указывать классы через запятую. 2. По принципу логического И (AND), для этого указываем классы слитно без запятых и пробелов. Подробности в примерах ниже. Полезные ссылки https://developer.mozilla.org/ru/docs/Web/API/Element/querySelectorAll https://developer.mozilla.org/ru/docs/Web/API/Document/querySelector https://developer.mozilla.org/ru/docs/Web/API/NodeList http://froland.ru/samodel/lsn_js33.html Примеры Скопируйте данный код в HTML файл CODE <html>
<head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>querySelectorAll</title> </head> <body> <div id="example"> <p id="p1" class="aaa bbb"/> <p id="p2" class="aaa ccc"/> <p id="p3" class="bbb ccc"/> <p id="p4" class="ccc"/> </div> <script type="text/javascript"> /* Пример 1 Вернет все элементы, которые содержат указанный класс. Вернет P1 и P2 */ var elems = document.getElementById("example").querySelectorAll(".aaa"); /* Пример 2 Логическое ИЛИ (OR). Вернет элементы, которые содержат любой из перечисленных классов. Наличие пробела после запятой не играет роли. Вернет P1, P2 и P3. */ // Для теста раскомментируйте строку ниже. //var elems = document.getElementById("example").querySelectorAll(".aaa, .bbb"); /* Пример 3 Логическое И (AND). Вернет элементы, которые содержат одновременно два класса. Наличие пробела не допускается. Порядок указания классов неважен. ".ccc.bbb" и ".bbb.ccc" вернет одно и тоже. Вернет P3. */ // Для теста раскомментируйте строку ниже. //var elems = document.getElementById("example").querySelectorAll(".ccc.bbb"); /* Пример 4 Ничего не вернет. */ // Для теста раскомментируйте строку ниже. //var elems = document.getElementById("example").querySelectorAll(".bbb .ccc "); console.log(' '); for( var i=0; i<elems.length; i++ ) { if( elems[i].id != "" && elems[i].id !== undefined) { console.log(elems[i].id); } } </script> </body> </html> |
|
|
Просмотр профиля| Ответить |
1 чел. читают эту тему (гостей: 1, скрытых пользователей: 0)
Пользователей: 0
Реклама и Новости |
|
8.12.2024, 22:20 Посл. ответ от slalex |
|
|
|
3.1.2024, 5:58 Посл. ответ от Александр |
|
|
|
25.7.2022, 7:21 Посл. ответ от Fedorov |
|
|
|
16.3.2022, 12:28 Посл. ответ от Saveliy |
|
|
|
10.5.2019, 16:43 Посл. ответ от Saveliy |
Some topics |
|
Вчера, 22:01 Посл. ответ от Sergeii |
|
|
|
10.12.2024, 12:45 Посл. ответ от Reanimotor |
|
|
|
9.12.2024, 16:11 Посл. ответ от slalex |
|
|
|
9.12.2024, 12:16 Посл. ответ от Snaiperok8 |
|
|
|
9.12.2024, 10:53 Посл. ответ от jody |
| Сейчас: 12.12.2024, 0:25 |