Могу ли я обновить свойство всех элементов непосредственно

Question

Например:

var inputs = document.querySelectorAll('input[type="checkbox"]'); 

Я хочу, чтобы установить checked в истинна на всех входах. Можно ли это сделать, как в jQuery, без использования цикла for?

Answer 1

Использование чистого JavaScript вы можете использовать querySelectorAll() функцию, как показано ниже:

var checkboxes = document.querySelectorAll('input[type="checkbox"]'); 

for(var i=0; i<checkboxes.length; i++) { checkboxes[i].checked = true; } 

К сожалению, это не позволяет избежать зацикливания, которую я знаю, что вы хотели бы избежать, и он также не имеет отличную совместимость кросс-браузер, как может можно проверить here с IE 8, только имея возможность подключиться к селекторам CSS 2.1, и Pre IE8 не поддерживается вообще, но это лучшее, что можно сделать, не используя много кода и избегая jQuery.

Я знаю, что вы хотите, чтобы избежать JQuery, но, если вы передумаете, вы можете попробовать следующее:

$('input[type="checkbox"]').attr('checked', 'checked') 

Это должно зацепить к любому входу флажок и установите его атрибут проверить с помощью функции JQuery attr() ,

Если это не работает, попробуйте дать вашим Флажки свое собственное имя класса, такие как флажок и попробовать, как выглядит следующим образом:

$('.checkbox').attr('checked', 'checked') 

Это поможет с проблемами совместимости и позволит избежать зацикливания, но если вы этого не сделаете хотите пойти по маршруту jQuery, а затем проигнорировать.

Answer 2

Нет, это не может быть сделано без какой-либо итерации по узлам. jQuery выполняет итерацию по узлам, а просто скрывает ее от пользователя.

Ближайшим, который приходит на JQuery подобный стиль используется в браузере .forEach^[MDN], где поддерживается:

[].forEach.call(inputs, function() { 
    this.checked = true; 
}); 

Answer 3

без использования для цикла

В какой-то момент, вы потребуется какая-то форма цикла. Вы просто надеетесь отвлечь его?

NodeList s являются Array -как, так что вы можете call или apply методы из Array.prototype, включая iterators как forEach(). Пример from MDN:

Другой подход без расширения DOM:

var forEach = Array.prototype.forEach; 

var links = document.getElementsByTagName('a'); 
forEach.call(links, function(link){ // works in most browsers (please document here if you find browsers where it doesn't) 
    link.style.color = '#0F0'; 
}); 

Но обратите внимание, что даже forEach()depends on a loop (while в данном случае).

Answer 4

querySelectorAll возвращает NodeList. Вам нужно будет перебирать список, чтобы изменить каждый элемент в нем (jQuery также обходит всю коллекцию в фоновом режиме.каждый)

Вы можете использовать цикл (для, в то время, и т.д.), или вы можете использовать метод forEach на Array прототип

https://developer.mozilla.org/en-US/docs/DOM/NodeList#Workarounds