Thuộc tính quan trọng nhất của phần tử là thuộc tính href, cho biết đích của liên kết
Văn bản liên kết là phần sẽ hiển thị cho người đọc
Nhấp vào văn bản liên kết, sẽ đưa người đọc đến địa chỉ URL được chỉ định
Thí dụ
Ví dụ này cho thấy cách tạo liên kết đến W3Schools. com
Truy cập W3Schools. com
Tự mình thử »Theo mặc định, các liên kết sẽ xuất hiện như sau trong tất cả các trình duyệt
- Một liên kết chưa được truy cập được gạch chân và có màu xanh lam
- Một liên kết đã truy cập được gạch chân và có màu tím
- Một liên kết hoạt động được gạch dưới và màu đỏ
Mẹo. Tất nhiên, các liên kết có thể được tạo kiểu bằng CSS, để có giao diện khác
Liên kết HTML - Thuộc tính đích
Theo mặc định, trang được liên kết sẽ được hiển thị trong cửa sổ trình duyệt hiện tại. Để thay đổi điều này, bạn phải chỉ định một mục tiêu khác cho liên kết
Thuộc tính
window.open["//www.codexworld.com/", "_self"];0 chỉ định nơi mở tài liệu được liên kết
Thuộc tính
window.open["//www.codexworld.com/", "_self"];0 có thể có một trong các giá trị sau
window.open["//www.codexworld.com/", "_self"];
2 - Mặc định. Mở tài liệu trong cùng một cửa sổ/tab khi nó được nhấp vàowindow.open["//www.codexworld.com/", "_self"];
3 - Mở tài liệu trong cửa sổ hoặc tab mớiwindow.open["//www.codexworld.com/", "_self"];
4 - Mở tài liệu trong khung chínhwindow.open["//www.codexworld.com/", "_self"];
5 - Mở tài liệu trong toàn bộ cửa sổ
Thí dụ
Sử dụng target="_blank" để mở tài liệu được liên kết trong cửa sổ hoặc tab trình duyệt mới
Truy cập W3Schools
Tự mình thử »URL tuyệt đối so với. URL tương đối
Cả hai ví dụ trên đều sử dụng URL tuyệt đối [địa chỉ web đầy đủ] trong thuộc tính href
Liên kết cục bộ [liên kết đến một trang trong cùng một trang web] được chỉ định bằng một URL tương đối [không có "https. // phần www"]
Thí dụ
URL tuyệt đối
W3C
URL tương đối
Hình ảnh HTML
Hướng dẫn CSS
Tự mình thử »Liên kết HTML - Sử dụng hình ảnh làm liên kết
Để sử dụng hình ảnh làm liên kết, chỉ cần đặt thẻ 0 bên trong thẻ
Thí dụ
Visit CodexWorld
Nếu bạn muốn mở URL bằng JavaScript, phương thức open[] của giao diện Window là cách dễ nhất. Cửa sổ Javascript. open[] cho phép bạn mở URL trong tab hoặc cửa sổ trình duyệt. Bạn có thể sử dụng giá trị
window.open["//www.codexworld.com/", "_self"];2 trong tham số thứ hai của cửa sổ. open[] để mở URL trong cùng một tab và trong cùng một cửa sổ với JavaScript
Đoạn mã sau mở URL trong cùng một cửa sổ và tab của trình duyệt bằng JavaScript
window.open["//www.codexworld.com/", "_self"];
Đôi khi chúng tôi có thể yêu cầu mở các liên kết trong một tab mới, tuy nhiên chỉ phải tạo một tab duy nhất. Nếu tab mới đã được tạo bằng cách nhấp vào liên kết trước đó, thì nhấp vào liên kết khác sẽ tải trang trong tab đã tạo. Đó là - chúng tôi chỉ tạo một tab duy nhất cho một số liên kết
Hành vi này có lợi trong trường hợp chúng tôi muốn giới hạn số lượng tab mới được tạo bởi trang
Điều này có thể đạt được trong HTML bằng cách đặt cùng tên cho thuộc tính đích cho tất cả các liên kết đã cho. Tên có thể là bất cứ điều gì theo mong muốn
Link 1
Link 2
Link 3
Nếu mở các liên kết bằng phương thức Javascript open[], thì cần cung cấp cùng một tên cửa sổ cho tập hợp các liên kết đã cho
Tiết lộ. Hỗ trợ của bạn giúp giữ cho trang web hoạt động. Chúng tôi kiếm được phí giới thiệu cho một số dịch vụ chúng tôi đề xuất trên trang này. Tìm hiểu thêm
Link 1
Link 2
Link 3
nội dung
- 1 Ví dụ về mã
- 2 Khung không được dùng nữa;
- 3 Mục tiêu mặc định
- 4 a target=”_blank” Mở trong tab [hoặc cửa sổ] trình duyệt mới
- 4. 1 Tại sao phải mở trong trình duyệt mới?
- 4. 2 Mở tất cả các liên kết bên ngoài trong một tab mới bằng JavaScript
- 4. 3 Lý do không sử dụng `target=”_blank”
- 5 Giá trị của Thuộc tính mục tiêu
- 6 Tất cả thuộc tính của Phần tử neo
- 7 Hỗ trợ trình duyệt cho mục tiêu
Mã ví dụ
The home page will open in another tab.Trang chủ sẽ mở trong một tab khác
Khung không dùng nữa;
Giá trị hiện tại duy nhất có liên quan của
window.open["//www.codexworld.com/", "_self"];0 là
window.open["//www.codexworld.com/", "_self"];3. Các giá trị khác của
window.open["//www.codexworld.com/", "_self"];0 được sử dụng để chỉ định các khung cụ thể. Tuy nhiên, các khung không được dùng trong HTML5
Mặc định window.open["//www.codexworld.com/", "_self"];
0
Nếu không có
window.open["//www.codexworld.com/", "_self"];0 nào được chỉ định, liên kết sẽ mở trong ngữ cảnh hiện tại, trừ khi người dùng hoặc trình duyệt chỉ định khác
a target=”_blank” Mở trong Tab Trình duyệt Mới [hoặc Cửa sổ]
Thuộc tính
window.open["//www.codexworld.com/", "_self"];0 chỉ định nơi tài liệu được liên kết sẽ mở khi liên kết được nhấp vào. Mặc định là cửa sổ hiện hành. Nếu
jQuery[document.links] .filter[function[] { return this.hostname != window.location.hostname; }] .attr['target', '_blank']; Tại sao mở trong một trình duyệt mới?
Lý do phổ biến nhất để sử dụng `target=”_blank” là để các liên kết ngoại vi mở trong một tab riêng biệt. Điều này cho phép người dùng nhấp vào một tài liệu tham khảo và quay lại sau mà không cần rời khỏi trang hiện tại. Nó giữ khách truy cập trên trang web của bạn lâu hơn và cải thiện hầu hết các số liệu của bạn. tỷ lệ thoát, chuyển đổi, các trang đã truy cập
Mở tất cả các liên kết bên ngoài trong một tab mới bằng JavaScript
Bạn không cần thêm thủ công
jQuery[document.links] .filter[function[] { return this.hostname != window.location.hostname; }] .attr['target', '_blank']; window.open["//www.codexworld.com/", "_self"];3
jQuery[document.links] .filter[function[] { return this.hostname != window.location.hostname; }] .attr['target', '_blank']; [Bạn có thể thấy hình thức sửa đổi một chút của mã này đang hoạt động trên mọi trang của trang web này. ] Thủ thuật này yêu cầu jQuery, nhưng rất có thể bạn đã sử dụng nó rồi. Nó được sử dụng trong các khung và hệ thống quản lý nội dung phổ biến nhất, bao gồm WordPress, Drupal và Twitter Bootstrap. Nếu bạn cần làm điều đó mà không có jQuery, điều đó cũng có thể được thực hiện. Đây là phiên bản "JavaScript đơn giản"
function externalLinks[] { for[var c = document.getElementsByTagName["a"], a = 0;a < c.length;a++] { var b = c[a]; b.getAttribute["href"] && b.hostname !== location.hostname && [b.target = "_blank"] } } ; externalLinks[]; Bên cạnh việc làm cho nó dễ dàng hơn, điều này sẽ làm sạch đánh dấu của bạn một cách đáng kể
Lý do không sử dụng `target=”_blank”
Một số người cho rằng người dùng không thích mở liên kết trong ngữ cảnh duyệt web mới. Họ cho rằng làm như vậy giống như quảng cáo bật lên và các hành vi gây phiền nhiễu khác. Với sự gia tăng của trình duyệt theo tab, lập luận này phần lớn đã biến mất. Hầu hết người dùng thích mở các liên kết trong một tab mới, vì nó cho phép họ đến các liên kết được tham chiếu trong hàng đợi để đọc sau mà không làm mất ngữ cảnh duyệt web hiện tại của họ