Thẻ neo không có thuộc tính href có an toàn không?

Có ổn không khi sử dụng thẻ neo mà không bao gồm hrefthuộc tính và thay vào đó sử dụng trình xử lý sự kiện nhấp vào JavaScript? Vì vậy, tôi sẽ bỏ qua hrefhoàn toàn, thậm chí không có nó trống ( href="").

Trong HTML5, sử dụng một aphần tử không có hrefthuộc tính là hợp lệ. Nó được coi là một "siêu liên kết giữ chỗ."

Thí dụ:

<a>previous</a>

Tìm "siêu liên kết giữ chỗ" trên trang tham chiếu thẻ neo w3c: https://www.w3.org/TR/2016/REC-html51-20161101/textlevel-semantics.html#the-a-element .

Và nó cũng được đề cập trên wiki ở đây: https://www.w3.org/wiki/Elements/a

Liên kết giữ chỗ dành cho các trường hợp bạn muốn sử dụng phần tử neo, nhưng không có nó điều hướng ở bất cứ đâu. Điều này rất hữu ích để đánh dấu trang hiện tại trong menu điều hướng hoặc đường dẫn bánh mì. (Cách tiếp cận cũ sẽ là sử dụng thẻ span hoặc thẻ neo với một lớp có tên là "hoạt động" hoặc "hiện tại" để tạo kiểu cho nó và JavaScript để hủy điều hướng.)

Liên kết giữ chỗ cũng hữu ích trong trường hợp bạn muốn tự động đặt đích của liên kết qua JavaScript khi chạy. Bạn chỉ cần đặt giá trị của thuộc tính href và thẻ neo trở nên có thể nhấp được.

Xem thêm:

• https://stackoverflow.com/a/10510353/19112
• http://www.html5in24hours.com/2012/06/8-ways-to-get-started-with-html5-today/
• http://webdesign.about.com/od/html5tutorials/qt/html5-placeholder-links.htmlm

Không sao, nhưng đồng thời có thể khiến một số trình duyệt bị chậm.

http://webdesignfan.com/yslow-tutorial-part-2-of-3-reducing-server-calls/

Lời khuyên của tôi là sử dụng <a href="#"> </a>

Nếu bạn đang sử dụng JQuery, hãy nhớ sử dụng:

.click(function(event){
    event.preventDefault();
    // Click code here...
});

Câu trả lời ngắn gọn: Không.

Câu trả lời dài:

Đầu tiên, không có thuộc tính href, nó sẽ không phải là một liên kết. Nếu đó không phải là một liên kết thì nó sẽ không phải là bàn phím (hoặc công tắc hơi thở, hoặc nhiều thiết bị đầu vào không dựa trên con trỏ khác) có thể truy cập được (trừ khi bạn sử dụng các tính năng HTML 5 tabindexkhông được hỗ trợ chung). Rất hiếm khi điều khiển không có quyền truy cập bàn phím.

Thứ hai. Bạn nên có một giải pháp thay thế khi JavaScript không chạy (vì tải chậm từ máy chủ, kết nối Internet bị ngắt (ví dụ: tín hiệu di động trên tàu di chuyển), JS bị tắt, v.v.).

Sử dụng tăng cường lũy ​​tiến bằng cách sử dụng JS không phô trương.

Nếu bạn phải sử dụng href để có khả năng tương thích ngược, bạn cũng có thể sử dụng

<a href="javascript:void(0)">link</a>

thay vì #, nếu bạn không muốn sử dụng thuộc tính

Thẻ này là tốt để sử dụng mà không có thuộc tính href. Trái với nhiều câu trả lời ở đây, thực sự có những lý do tiêu chuẩn để tạo ra một mỏ neo khi không có href. Về mặt ngữ nghĩa, "a" có nghĩa là một mỏ neo hoặc một liên kết. Nếu bạn sử dụng nó cho bất cứ điều gì theo ý nghĩa đó, thì bạn vẫn ổn.

Một cách sử dụng tiêu chuẩn của thẻ mà không có href là tạo các liên kết được đặt tên. Điều này cho phép bạn sử dụng một neo với name = blah và sau này bạn có thể tạo một neo với href = # blah để liên kết đến phần được đặt tên của trang hiện tại. Tuy nhiên, điều này đã không được chấp nhận vì bạn cũng có thể sử dụng ID theo cách tương tự. Ví dụ: bạn có thể sử dụng thẻ tiêu đề với id = title và sau đó bạn có thể có một neo trỏ tới href = # tiêu đề.

Quan điểm của tôi, tuy nhiên, không đề xuất sử dụng thuộc tính tên. Chỉ cung cấp một trường hợp sử dụng khi bạn không cần href, và do đó lý do tại sao không cần thiết.

Từ góc độ khả năng truy cập <a>mà không có a href thì không thể có tab, tất cả các liên kết phải có khả năng tab, vì vậy hãy thêm tabindex = '0 "nếu bạn không có a href.

Các <a>thẻ nếu không có sự "href" có thể được thuận tiện khi sử dụng menu đa cấp và bạn cần phải mở rộng cấp độ tiếp theo nhưng không muốn điều đó nhãn menu để trở thành một liên kết hoạt động. Tôi chưa bao giờ có bất kỳ vấn đề sử dụng nó theo cách đó.

Trong một số trình duyệt, bạn sẽ gặp vấn đề nếu bạn không cung cấp thuộc tính href. Tôi đề nghị bạn viết mã của bạn một cái gì đó như thế này:

<a href="#" onclick="yourcode();return false;">Link</a>

bạn có thể thay thế yourcode () bằng hàm hoặc logic của riêng bạn, nhưng hãy nhớ thêm return false; tuyên bố ở cuối