Помощник
        Здравствуйте, гость ( Вход | Регистрация )
|  28.4.2016, 23:04 
				 Сообщение
					#226103
					
				
			 | |
|  Special Группа: Главные администраторы Сообщений: 13309 Спасибо сказали: 2056 раз  | 
				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> | 
|     |  | 
| Ответить | 
 Реклама и Новости
 Реклама и Новости|  |  | 27.10.2025, 18:12 Посл. ответ от apr | |
|  |  | 3.1.2024, 5:58 Посл. ответ от Александр | |
|  |  | 25.7.2022, 7:21 Посл. ответ от Fedorov | |
|  |  | 16.3.2022, 12:28 Посл. ответ от Saveliy | |
|  |  | 22.3.2015, 3:08 Посл. ответ от Saveliy | 
 Some topics
 Some topics|  |  | Сегодня, 0:16 Посл. ответ от HETPE3B | |
|  |  | Вчера, 18:03 Посл. ответ от Reanimotor | |
|  |  | 28.10.2025, 23:06 Посл. ответ от Александр | |
|  |  | 28.10.2025, 18:49 Посл. ответ от vasily | |
|  |  | 28.10.2025, 17:07 Посл. ответ от Vanadii | 
| Сейчас: 31.10.2025, 3:10 |