В чем разница между приведенными ниже двумя способами?
document.getElementById('myRadio').checked = "checked";
и
document.getElementById('myRadio').checked = true;
Для меня оба ведут себя одинаково. Но мне просто интересно узнать, почему существуют два способа сделать то же самое.
Какой из них будет идеальным? Мне нужно поддерживать версии IE7 и более поздние версии.
document.getElementById('myRadio').checked - это логическое значение. Он должен быть true или false
document.getElementById('myRadio').checked = "checked"; выводит строку в логическое значение, которое истинно.
document.getElementById('myRadio').checked = true; просто назначает true без кастинга.
Используйте true, поскольку он немного более эффективен и больше предназначен для разработчиков.
Оригинальный атрибут checked (HTML 4 и ранее) не требовал значения на нем - если он существовал, элемент был "проверен", если нет, это не так.
Это, однако, неверно для XHTML, следующего за HTML 4.
В стандарте предлагается использовать checked="checked" как условие для истины, поэтому оба способа, по которым вы отправили сообщение, в конечном итоге делают то же самое.
Не важно, какой из них вы используете - используйте тот, который имеет для вас наибольший смысл и придерживайтесь его (или соглашайтесь с вашей командой, куда идти).
document.getElementById('myRadio') возвращает вам элемент DOM, я буду ссылаться на него как elem в этом ответе.
elem.checked обращается к свойству с именем checked элемента DOM. Это свойство всегда является логическим.
При написании HTML вы используете checked="checked" в XHTML; в HTML вы можете просто использовать checked. При настройке атрибута (это делается через .setAttribute('checked', 'checked')) вам нужно указать значение, поскольку некоторые браузеры считают, что пустое значение несуществует.
Однако, поскольку у вас есть элемент DOM, у вас нет причин устанавливать атрибут, поскольку вы можете просто использовать для него гораздо более удобное логическое свойство. Поскольку непустые строки считаются true в булевом контексте, установка elem.checked в 'checked' или что-либо еще, что не является фальшивым значением (даже 'false' или '0'), этот флажок будет установлен. Нет причин не использовать true и false, хотя вы должны придерживаться правильных значений.
Элемент имеет как атрибут, так и свойство с именем checked. Свойство определяет текущее состояние.
Атрибут - это строка, а свойство - логическое. Когда элемент создается из HTML-кода, атрибут устанавливается из разметки, а свойство устанавливается в зависимости от значения атрибута.
Если значение атрибута в разметке отсутствует, атрибут становится null, но свойство всегда равно true или false, поэтому оно становится false.
Когда вы устанавливаете свойство, вы должны использовать логическое значение:
document.getElementById('myRadio').checked = true;
Если вы установите атрибут, вы используете строку:
document.getElementById('myRadio').setAttribute('checked', 'checked');
Обратите внимание, что установка атрибута также изменяет свойство, но установка свойства не изменяет атрибут.
Обратите внимание также, что независимо от значения, которое вы задали для этого атрибута, свойство становится true. Даже если вы используете пустую строку или null, установка атрибута означает, что она была проверена. Используйте removeAttribute, чтобы снять элемент с помощью атрибута:
document.getElementById('myRadio').removeAttribute('checked');
checked attribute - это логическое значение, поэтому "checked" значение другого "string", кроме boolean false, преобразуется в true.
Любое строковое значение будет истинным. Также наличие атрибута делает его истинным:
<input type="checkbox" checked>
Вы можете сделать его необработанным, только делая логическое изменение в DOM с помощью JS.
Итак, ответ таков: они равны.