Node: thuộc tính previousSibling
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.
Thuộc tính chỉ đọc previousSibling của giao diện Node trả về nút đứng ngay trước nút đã chỉ định trong danh sách childNodes của nút cha, hoặc null nếu nút đã chỉ định là nút đầu tiên trong danh sách đó.
Note:
Trình duyệt chèn các nút văn bản vào tài liệu để biểu diễn khoảng trắng trong mã nguồn. Vì vậy, một nút lấy được, chẳng hạn bằng Node.firstChild hoặc Node.previousSibling, có thể là một nút văn bản khoảng trắng thay vì phần tử thực sự mà tác giả muốn lấy.
Xem Làm việc với khoảng trắng trong DOM để biết thêm chi tiết.
Bạn có thể dùng previousElementSibling để lấy nút phần tử trước đó (bỏ qua các nút văn bản và mọi nút không phải phần tử khác).
Để đi theo chiều ngược lại qua danh sách nút con, hãy dùng Node.nextSibling.
Giá trị
Một Node đại diện cho nút anh em trước đó của nút hiện tại, hoặc null nếu không có.
Ví dụ
Các ví dụ sau minh họa cách previousSibling hoạt động khi có và khi không có các nút văn bản trộn lẫn với phần tử.
Ví dụ thứ nhất
Trong ví dụ này, chúng ta có một loạt phần tử <span> nằm sát nhau, không có khoảng trắng ở giữa.
<span id="b0"></span><span id="b1"></span><span id="b2"></span>
document.getElementById("b1").previousSibling; // <span id="b0">
document.getElementById("b2").previousSibling.id; // "b1"
Ví dụ thứ hai
Trong ví dụ này, có các nút văn bản khoảng trắng (ngắt dòng) giữa các phần tử <span>.
<span id="b0"></span>
<span id="b1"></span>
<span id="b2"></span>
document.getElementById("b1").previousSibling; // #text
document.getElementById("b1").previousSibling.previousSibling; // <span id="b0">
document.getElementById("b2").previousSibling.previousSibling; // <span id="b1">
document.getElementById("b2").previousSibling; // #text
document.getElementById("b2").previousSibling.id; // undefined
Thông số kỹ thuật
| Specification |
|---|
| DOM # ref-for-dom-node-previoussibling① |