XML DOM - đối tượng Range

đối tượng Range đại diện cho phạm vi liên tục trong tài liệu.

đối tượng Range

đối tượng Range đại diện cho phạm vi khu vực liên tục trong tài liệu, như khu vực được chọn bởi người dùng bằng cách kéo chuột trong cửa sổ trình duyệt.

Nếu một thực hiện hỗ trợ mô-đun Range, thì đối tượng Documentđã định nghĩa phương thức createRange()để tạo mới đối tượng Range.

Lưu ý:IE đã định nghĩa phương thức Document.createRange() không tương thích, đối tượng mà nó trả về tương tự như giao diện Range, nhưng không tương thích.

Giao diện Range đã định nghĩa rất nhiều phương thức để xác định khu vực đã chọn trong tài liệu “chọn”, ngoài ra còn có một số phương thức để thực hiện các thao tác cắt và dán trong khu vực đã chọn.

Các thuộc tính của giao diện Range cung cấp các phương thức để lấy các nút biên giới và vị trí dịch chuyển của phạm vi. Các phương thức của nó cung cấp các phương thức để đặt các biên giới của phạm vi. Lưu ý rằng các biên giới của phạm vi có thể được đặt thành Document hoặc đối tượng DocumentFragmenttrong các nút đó. Một khi đã xác định điểm biên giới của phạm vi, bạn có thể sử dụng các phương thức deleteContents(), extractContents(), cloneContents() và insertNode() để thực hiện các thao tác cắt, sao chép và dán.

Khi thay đổi tài liệu thông qua các thao tác chèn hoặc xóa, tất cả các đối tượng Range đại diện cho một phần của tài liệu sẽ thay đổi (nếu cần thiết), để duy trì điểm biên giới hợp lệ và để chúng (càng gần gũi càng tốt) đại diện cho nội dung tài liệu tương tự.

Từ điển: phạm vi, điểm biên giới và vị trí dịch chuyển

Một phạm vi có hai điểm biên giới, tức là điểm bắt đầu và điểm kết thúc. Mỗi điểm biên giới được xác định bởi một nút và vị trí dịch chuyển của nút đó. Nút đó thường là nút Elementvànút Documenthoặc nút Text。Đối với các nút Element và nút Document, vị trí dịch chuyển chỉ đến các con nút của nút đó. Vị trí dịch chuyển là 0 thì điểm biên giới nằm trước con nút đầu tiên của nút đó. Vị trí dịch chuyển là 1 thì điểm biên giới nằm sau con nút đầu tiên, trước con nút thứ hai. Nhưng nếu điểm biên giới là nút Text, vị trí dịch chuyển thì chỉ đến vị trí giữa hai ký tự trong văn bản.

Hằng số của đối tượng Range

Các hằng số này xác định cách so sánh điểm biên của đối tượng Range.

Họ là của phương thức compareBoundaryPoints(). how Giá trị hợp lệ của tham số:

Hằng số Mô tả
START_TO_START So sánh điểm bắt đầu của Range được chỉ định với điểm bắt đầu của Range hiện tại.
START_TO_END So sánh điểm kết thúc của Range được chỉ định với điểm kết thúc của Range hiện tại.
END_TO_END So sánh điểm kết thúc của Range được chỉ định với điểm kết thúc của Range hiện tại.
END_TO_START So sánh điểm kết thúc của Range được chỉ định với điểm bắt đầu của Range hiện tại.

Thuộc tính của đối tượng Range

Lưu ý:Tất cả các thuộc tính đều là chỉ đọc, không thể thay đổi điểm bắt đầu và điểm kết thúc của Range bằng cách thiết lập các thuộc tính này. Bạn phải gọi phương thức setEnd() và setStart() để thực hiện điều này.

Lưu ý:Bất kỳ việc đọc thuộc tính nào sau khi gọi phương thức detach() sẽ ném mã lỗi INVALID_STATE_ERR. Lỗi DOMException.

Thuộc tính Mô tả
collapsed Nếu điểm bắt đầu và điểm kết thúc của Range ở cùng một vị trí trong tài liệu, thì giá trị là true, tức là Range là rỗng hoặc đã gấp lại.
commonAncestorContainer Điểm bắt đầu và kết thúc của Range (tức là các nút tổ tiên của chúng), điểm tài liệu sâu nhất được bao bọc.
endContainer Điểm tài liệu chứa điểm kết thúc của Range.
endOffset Vị trí điểm kết thúc trong endContainer.
startContainer Điểm tài liệu chứa điểm bắt đầu của Range.
startOffset Vị trí điểm bắt đầu trong startContainer.

Phương thức của đối tượng Range

Lưu ý:Nếu đã gọi phương thức detach() của Range, thì bất kỳ phương thức nào của đối tượng Range được gọi tiếp theo sẽ ném mã lỗi INVALID_STATE_ERR. Lỗi DOMException.

Phương thức Mô tả
cloneContents() Trả về đối tượng DocumentFragment mới, chứa bản sao của khu vực tài liệu được biểu thị bởi Range.
cloneRange() Tạo một đối tượng Range mới, biểu thị khu vực tài liệu tương tự như Range hiện tại.
collapse() Gấp gọn phạm vi, để điểm biên của nó trùng nhau.
compareBoundaryPoints() So sánh điểm biên của phạm vi được chỉ định và điểm biên của phạm vi hiện tại, trả về -1, 0 và 1 dựa trên thứ tự của chúng. So sánh điểm biên nào được chỉ định bởi tham số đầu tiên, giá trị của nó phải là một trong các hằng số đã định nghĩa trước.
deleteContents() Xóa khu vực tài liệu được biểu diễn bởi đối tượng Range hiện tại.
detach() Thông báo rằng thực hiện không còn sử dụng phạm vi hiện tại, có thể dừng theo dõi. Nếu gọi phương pháp này của phạm vi, bất kỳ phương pháp nào của phạm vi được gọi tiếp theo sẽ ném lỗi với mã INVALID_STATE_ERR. Lỗi DOMException.
extractContents() Xóa khu vực tài liệu được biểu diễn bởi phạm vi hiện tại và trả về nội dung của khu vực đó dưới dạng đối tượng DocumentFragment. Phương pháp này và sự kết hợp của phương pháp cloneContents() và deleteContents() rất tương tự.
insertNode() Chèn điểm node được chỉ định vào điểm bắt đầu của phạm vi tài liệu.
selectNode() Đặt điểm biên của phạm vi để nó bao gồm node được chỉ định và tất cả con của nó.
selectNodeContents() Đặt điểm biên của phạm vi để nó bao gồm con của node được chỉ định, nhưng không bao gồm node được chỉ định.
setEnd() Đặt điểm kết thúc của phạm vi thành vị trí và độ dịch chuyển của node được chỉ định.
setEndAfter() Đặt điểm kết thúc của phạm vi thành điểm gần node được chỉ định sau.
setEndBefore() Đặt điểm kết thúc của phạm vi thành điểm gần node được chỉ định trước.
setStart() Đặt điểm bắt đầu của phạm vi thành vị trí chèn của node được chỉ định.
setStartAfter() Đặt điểm bắt đầu của phạm vi thành điểm gần node được chỉ định sau.
setStartBefore() Đặt điểm bắt đầu của phạm vi thành điểm gần node được chỉ định trước.
surroundContents() Chèn điểm node được chỉ định vào điểm bắt đầu của phạm vi tài liệu, sau đó định lại cha của tất cả các node trong phạm vi, để chúng trở thành con của node được chèn mới.
toString() Trả về nội dung văn bản nguyên bản của khu vực tài liệu mà phạm vi biểu diễn.