Yếu tố nchor <a>
chỉ đơn giản là một neo đến hoặc từ một số nội dung. Ban đầu đặc điểm kỹ thuật HTML được phép cho các neo được đặt tên (<a name="foo">
) và các neo liên kết (<a href="#foo">
).
Định dạng neo được đặt tên ít thường được sử dụng, vì định danh phân đoạn hiện được sử dụng để chỉ định thuộc tính [id]
(mặc dù khả năng tương thích ngược, bạn vẫn có thể chỉ định thuộc tính [name]
). An <a>
element without an [href]
attribute is still valid.
Theo như ngữ nghĩa và kiểu dáng có liên quan, phần tử <a>
không phải là liên kết (:link
) trừ khi thuộc tính có thuộc tính [href]
. Một tác dụng phụ của điều này là mặc định, thành phần <a>
không có [href]
sẽ không theo thứ tự tabbing.
Câu hỏi thực sự là liệu phần tử <a>
có phải là đại diện thích hợp của <button>
hay không. Ở cấp độ ngữ nghĩa, có sự khác biệt rõ rệt giữa một số link
và một số button
.
Nút là thứ mà khi được nhấp vào sẽ gây ra một hành động.
Liên kết là nút gây ra thay đổi trong điều hướng trong tài liệu hiện tại. Điều hướng xảy ra có thể di chuyển trong tài liệu trong trường hợp số nhận dạng phân đoạn (#foo
) hoặc chuyển sang tài liệu mới trong trường hợp url (/bar
).
Vì liên kết là một loại nút đặc biệt, chúng thường bị ghi đè hành động để thực hiện các chức năng thay thế. Tiếp tục sử dụng một neo như là một nút là ok từ một quan điểm nhất quán, mặc dù nó không phải là khá chính xác ngữ nghĩa.
Nếu bạn lo ngại về ngữ nghĩa và khả năng tiếp cận của việc sử dụng một yếu tố <a>
(hoặc <span>
, hoặc <div>
) như là một nút, bạn nên thêm các thuộc tính sau:
<a role="button" tabindex="0" ...>...</a>
Các button role nói cho người dùng biết các yếu tố cụ thể đang được coi như một nút như là một ghi đè cho bất kỳ ngữ nghĩa các yếu tố cơ bản có thể đã có.
Đối <span>
và <div>
yếu tố, bạn có thể muốn thêm JavaScript nghe then chốt cho Space hay Nhập để kích hoạt sự kiện click
. <a href>
và <button>
yếu tố làm điều này theo mặc định, nhưng các yếu tố không phải nút thì không. Đôi khi nó có ý nghĩa hơn để ràng buộc kích hoạt click
với một khóa khác. Ví dụ: nút "trợ giúp" trong ứng dụng web có thể bị ràng buộc với F1.
'href =" # "' Tôi đã nghe nói đến. 'javascript: void (0)' Tôi đã nghe nói đến. Điều này tôi chưa bao giờ nghe nói cho đến bây giờ, nhưng nó có vẻ làm cho ý nghĩa nhất. Đây là tiêu chuẩn và hoạt động trên hầu hết các trình duyệt, phải không? – Zacqary
@Zacqary, '[role =" button "]' không làm bất cứ điều gì cụ thể, bạn vẫn cần phải lắng nghe sự kiện bấm (nhưng bạn vẫn làm điều đó để tạo nút JS). Nó có nghĩa là để được sử dụng để điều hướng hỗ trợ (aka độc giả màn hình) để người đọc màn hình biết để đại diện cho các yếu tố như là một nút chứ không phải là giá trị ngữ nghĩa ban đầu của nó. Việc thêm '[tabindex]' sẽ thêm phần tử vào thứ tự tabbing. Trong trường hợp đặc biệt, bạn có thể không thực sự muốn/cần nút điều hướng theo thứ tự tabbing, do đó, nó là một thuộc tính tùy chọn. Các phần tử đã là các nút không cần '[role =" button "]' vì nó thừa. – zzzzBov
HTML có hợp lệ để có thẻ neo không có href và không có tên không? Trong ứng dụng của chúng tôi, chúng tôi có một số liên kết xóa được vô hiệu hóa (do đó không có thuộc tính href), nhưng vẫn hiển thị cho người dùng. –