this.id (как вы знаете) this.value (для большинства типов ввода. Мне известны только проблемы с IE, когда <select> не имеет свойств value, установленных на его <option> элементах, или радиовходы в Safari.) this.className чтобы получить или установить свойство "class" целиком this.selectedIndex против <select> для получения выбранного индекса this.options против <select>, чтобы получить список <option> элементов this.text против <option> для получения его текстового содержимого this.rows против <table>, чтобы получить коллекцию <tr> элементов this.cells против <tr>, чтобы получить его клетки (td & th) this.parentNode чтобы получить прямого родителя this.checked чтобы получить проверенное состояние checkbox Спасибо @Tim Down this.selected, чтобы получить выбранное состояние option Спасибо @Tim Down this.disabled чтобы получить отключенное состояние input Спасибо @Tim Down this.readOnly для получения состояния readOnly input Спасибо @Tim Down this.href против элемента <a>, чтобы получить его hrefthis.hostname против элемента <a>, чтобы получить домен его hrefthis.pathname против элемента <a>, чтобы получить путь к его hrefthis.search против элемента <a>, чтобы получить строку запроса его hrefthis.src против элемента, для которого допустимо иметь src
... Я думаю, вы поняли.
Будут времена, когда производительность имеет решающее значение. Например, если вы выполняете что-то в цикле много раз, вы можете отказаться от jQuery.
В общем, вы можете заменить:
$(el).attr('someName');
с
Выше было плохо сформулировано. getAttribute не является заменой, но он извлекает значение атрибута, отправленного с сервера, и соответствующий ему setAttribute установит его. Необходим в некоторых случаях.
Приведенные ниже предложения как бы охватывают это. См. Этот ответ для лучшего лечения.
el.getAttribute('someName');
... для прямого доступа к атрибуту. Обратите внимание, что атрибуты не совпадают со свойствами (хотя иногда они отражают друг друга). Конечно, setAttribute тоже.
Скажем, у вас возникла ситуация, когда получили страницу, где нужно развернуть все теги определенного типа. Это быстро и просто с jQuery:
$('span').unwrap(); // unwrap all span elements
Но если их много, вы можете захотеть сделать небольшой нативный DOM API:
var spans = document.getElementsByTagName('span');
while( spans[0] ) {
var parent = spans[0].parentNode;
while( spans[0].firstChild ) {
parent.insertBefore( spans[0].firstChild, spans[0]);
}
parent.removeChild( spans[0] );
}
Этот код довольно короткий, он работает лучше, чем версия jQuery, и его легко превратить в функцию многократного использования в вашей личной библиотеке.
Может показаться, что у меня бесконечный цикл с внешним while из-за while(spans[0]), но, поскольку мы имеем дело с «живым списком», он обновляется, когда мы делаем parent.removeChild(span[0]);. Это довольно изящная функция, которую мы упускаем при работе с массивом (или объектом, похожим на массив).