this.id (như bạn đã biết)
this.value(trên hầu hết các loại đầu vào. chỉ các vấn đề tôi biết là IE khi <select>không có valuethuộc tính được đặt trên các <option>thành phần của nó hoặc đầu vào radio trong Safari.)
this.className để có được hoặc thiết lập toàn bộ thuộc tính "lớp"
this.selectedIndexdựa vào a <select>để lấy chỉ mục đã chọn
this.optionschống lại một <select>để có được một danh sách các <option>yếu tố
this.textchống lại <option>để có được nội dung văn bản của nó
this.rowschống lại một <table>để có được một bộ sưu tập các <tr>yếu tố
this.cellschống lại a <tr>để có được các tế bào của nó (td & th)
this.parentNode để có được cha mẹ trực tiếp
this.checkedđể nhận trạng thái đã kiểm tra của checkbox Cảm ơn @Tim Down
this.selectedđể nhận trạng thái đã chọn của option Cảm ơn @Tim Down
this.disabledđể có được trạng thái bị vô hiệu hóa của input Cảm ơn @Tim Down
this.readOnlyđể có được trạng thái readOnly của một lời input cảm ơn @Tim Down
this.hrefchống lại một <a>yếu tố để có được nóhref
this.hostnamechống lại một <a>yếu tố để có được miền của nóhref
this.pathnamechống lại một <a>yếu tố để có được con đường của nóhref
this.searchdựa vào một <a>phần tử để có được chuỗi truy vấn của nóhref
this.src chống lại một yếu tố hợp lệ để có một src
...Tôi nghĩ rằng bạn có được ý tưởng.
Sẽ có lúc hiệu suất là rất quan trọng. Giống như nếu bạn đang thực hiện một cái gì đó trong một vòng lặp nhiều lần, bạn có thể muốn bỏ jQuery.
Nói chung, bạn có thể thay thế:
$(el).attr('someName');
với:
Ở trên là từ kém. getAttributekhông phải là sự thay thế, nhưng nó lấy ra giá trị của một thuộc tính được gửi từ máy chủ và tương ứng của nó setAttributesẽ đặt nó. Cần thiết trong một số trường hợp.
Các câu dưới đây sắp xếp nó. Xem câu trả lời này để điều trị tốt hơn.
el.getAttribute('someName');
... để truy cập một thuộc tính trực tiếp. Lưu ý rằng các thuộc tính không giống như các thuộc tính (mặc dù đôi khi chúng phản chiếu lẫn nhau). Tất nhiên là có setAttribute.
Giả sử bạn có một tình huống nhận được một trang nơi bạn cần mở ra tất cả các thẻ thuộc một loại nhất định. Nó ngắn và dễ dàng với jQuery:
$('span').unwrap(); // unwrap all span elements
Nhưng nếu có nhiều, bạn có thể muốn thực hiện một API DOM gốc:
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] );
}
Mã này khá ngắn, nó hoạt động tốt hơn phiên bản jQuery và có thể dễ dàng được tạo thành một chức năng có thể sử dụng lại trong thư viện cá nhân của bạn.
Có vẻ như tôi có một vòng lặp vô hạn với bên ngoài whilevì while(spans[0]), nhưng vì chúng ta đang xử lý một "danh sách trực tiếp" nên nó được cập nhật khi chúng ta thực hiện parent.removeChild(span[0]);. Đây là một tính năng khá tiện lợi mà chúng ta bỏ lỡ khi làm việc với một Array (hoặc đối tượng giống như Array) thay vào đó.
this.id?