HTMLAnchorElement: thuộc tính interestForElement
Khả dụng hạn chế
This feature is not Baseline because it does not work in some of the most widely-used browsers.
Experimental: This is an experimental technology
Check the Browser compatibility table carefully before using this in production.
Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.
Thuộc tính interestForElement của giao diện HTMLAnchorElement lấy hoặc đặt phần tử mục tiêu của một trình gọi quan tâm, trong trường hợp phần tử <a> liên quan được chỉ định là một trình gọi quan tâm.
Xem Tạo một trình gọi quan tâm để biết thêm chi tiết.
Giá trị
Một đối tượng Element, hoặc null nếu phần tử <a> liên quan không có phần tử mục tiêu được đặt.
Ví dụ
Sử dụng cơ bản interestForElement
Trong ví dụ này, chúng ta sử dụng thuộc tính interestForElement của một phần tử <a> để đặt phần tử mục tiêu của nó và sau đó lấy tagName của phần tử đó. tagName sau đó được hiển thị trong nội dung văn bản của phần tử <a>.
HTML
Phần đánh dấu bao gồm một phần tử <a> và một phần tử <div>. Chúng ta biến phần tử <div> thành một popover bằng cách đặt thuộc tính popover trên nó.
<a href="#">một liên kết</a>
<div id="mypopover" popover>Tôi là một phần tử <code><div></code>.</div>
JavaScript
Chúng ta lấy tham chiếu đến các phần tử <a> và <div> trong script. Sau đó, chúng ta tạo mối quan hệ trình gọi quan tâm - mục tiêu giữa <a> và <div> bằng cách đặt thuộc tính interestForElement của phần tử <a> bằng tham chiếu đến <div>. Sau đó, chúng ta cập nhật nội dung văn bản của phần tử <a> để bao gồm một chuỗi chứa tagName của phần tử mục tiêu, được lấy qua invoker.interestForElement.tagName.
const invoker = document.querySelector("a");
const popover = document.querySelector("div");
invoker.interestForElement = popover;
invoker.textContent = `Mục tiêu của tôi là một phần tử ${invoker.interestForElement.tagName}`;
Kết quả
Ví dụ được hiển thị như sau:
Thử thể hiện sự quan tâm đến liên kết (ví dụ: bằng cách di chuột hoặc tập trung vào nó) để làm cho <div> xuất hiện.