Chỉ Dẫn Nhanh: Thiết Lập Url Tương Đối Với Thẻ “base”

Cập nhật thông tin chi tiết về Chỉ Dẫn Nhanh: Thiết Lập Url Tương Đối Với Thẻ “base” mới nhất ngày 29/09/2020 trên website Zdungk.com. Hy vọng nội dung bài viết sẽ đáp ứng được nhu cầu của bạn, chúng tôi sẽ thường xuyên cập nhật mới nội dung để bạn nhận được thông tin nhanh chóng và chính xác nhất. Cho đến thời điểm hiện tại, bài viết này đã đạt được 3,069 lượt xem.

Thẻ <base> trong HTML là một phần tử tương đối ít được biết đến, gần đây đã trở thành một phần chính thức của HTML5. Nó cho phép bạn làm hai việc:

  1. Thiết lập URL mà bạn chọn như là cơ sở cho tất cả các URL tương đối.
  2. Thiết lập liên kết mặc định cho thuộc tính target.

Cài đặt và trường hợp sử dụng

Phần tử <base> được định nghĩa trong phần <head> và bạn có thể chỉ sử dụng nó một lần cho mỗi tài liệu. Bạn nên đặt nó càng sớm càng tốt trong phần head của bạn vì vậy bạn có thể bắt đầu sử dụng nó từ đó. Hai thuộc tính của nó là hreftarget. Bạn có thể sử dụng một trong hai thuộc tính này, hoặc cả hai cùng một lúc.

Ví dụ 1: Lối tắt để nạp các tài nguyên

Ví dụ bạn có một trang web lưu tất cả các hình ảnh và CSS của nó trong một thư mục có tên “assets”. Bạn có thể định nghĩa thẻ <base> của bạn như sau:

<head>
    <base href="http://www.myepicsite.com/assets/">
</head>

Điều này sau đó sẽ cho phép bạn tải bất kỳ hình ảnh hoặc CSS như thế này:

<head>
    <base href="http://www.myepicsite.com/assets/">
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <img src="image01.png?w=400" />
</body>

Liên kết tới style.css sẽ được phân giải thành http://www.myepicsite.com/assets/style.cssimage01.png?w=400 sẽ nạp từ http://www.myepicsite.com/assets/image01.png?w=400.

Ví dụ 2: URL nội tại

Nếu bạn có một domain cấp độ cao nhất chuyển tiếp đến một thứ gì đó giống như http://thisrocks.com/app/ và tất cả các liên kết nội tại cần bao gồm app/ trong URL của chúng.

Bạn có thể thiết lập URL cơ sở của bạn như thế này:

<base href="http://thisrocks.com/app/">

Từ đó mỗi khi bạn muốn liên kết từ một trang nội tại này đến một trang nội tại khác bạn có thể sử dụng:

<a href="anotherpage.htm">LINK</a>

Liên kết này sẽ được phân giải thành http://thisrocks.com/app/anotherpage.htm.

Ví dụ 3: Liên kết Target mặc định

Bạn cũng có thể sử dụng <base> để thiết lập target mặc định cho tất cả các liên kết trên trang web của bạn. Nếu bạn đã sử dụng:

 <base target="_blank">

.. .bất kỳ liên kết không được thiết lập target của riêng nó sẽ mở một cửa sổ mới. Bạn có thể sử dụng thuộc tính target với hoặc không cần một thuộc tính href đi kèm.

Chức năng này có thể hữu ích cho các nội dung được nạp thông qua một iFrame, như bạn sẽ có thể tự động có tất cả các liên kết trong đó nhắm mục tiêu đến frame cha.

Nhược điểm

Mặc dù url <base> có thể thuận tiện, nhưng nhược điểm của nó nằm xung quanh một thực tế rằng sau khi xác định nó một lần thì bạn sẽ bị mắc kẹt với nó. Bạn chỉ có thể sử dụng nó theo một cách duy nhất và sau đó nó sẽ ảnh hưởng đến tất cả các URL. Bất cứ nơi nào mà bạn không muốn sử dụng giá trị mặc định trong thẻ <base> của bạn, thì bạn phải thay thế chúng.

Bạn có nên sử dụng nó để phân giải thư mục assets của bạn như chúng tôi đã làm ở trên, và sau đó muốn liên kết từ một trang này đến trang khác trong cùng một trang web của bạn, thì bạn không thể làm như vậy với HTML thông thường của <a href="page.html">Page</a>.

Điều này là bởi vì URL cơ sở đang là http://www.myepicsite.com/assets/ thì người truy cập web của bạn sẽ được gửi đến http://www.myepicsite.com/assets/page.html.

Như vậy bạn sẽ phải thay thế cài đặt thẻ <base> của bạn bằng cách sử dụng URL tuyệt đối thay vào đó, tức là <a href="http://www.myepicsite.com/page.html">Page</a>.

Liên kết trong trang

Khi sử dụng <base>, bạn cũng có thể gặp các vấn đề với các liên kết trong trang.

Thông thường, một liên kết như <a href="#top">Back to Top</a> sẽ giữ cho bạn trên cùng một trang, nhưng chuyển đến vị trí của một phần tử mang id = "top", ví dụ như nó sẽ phân giải thành http://thisrocks.com/app/article.html#top.

Tuy nhiên nếu bạn đang sử dụng một thẻ <base> với một thuộc tính href thì bạn được gửi đến URL cơ sở với #top được nối vào phía sau, ví dụ như http://thisrocks.com/app/#top.

Một lần nữa, trong trường hợp này bạn sẽ phải thay thế thiết lập mặc định trong thẻ <base> của bạn bằng cách xác định trang mà bạn muốn liên kết thành tương đối, ví dụ như <a href="article.html#top">Back to Top</a>.

Nơi <base> hoạt động tốt nhất

Thẻ <base> được sử dụng tốt nhất trong trường hợp bạn biết nơi nào bạn sẽ có thể phát huy đầy đủ quyền kiểm soát việc sử dụng của tất cả các URL, tức là bạn biết bạn sẽ có thể ghi đè các mặc định khi cần thiết. Nếu bạn đang tạo một theme cho một CMS nơi mà có rất nhiều biến không biết đây có thể là một ý tưởng tốt để cho <base> thoát khỏi mớ hỗ độn.

Tuy nhiên, nếu bạn đang xây dựng một trang web HTML tĩnh thì <base> có thể rất hữu ích. Đây là trường hợp thậm chí tốt hơn nếu bạn đang sử dụng một ngôn ngữ templating như Jade hoặc Handlebars cho phép bạn đặt lối tắt như <a href="{url}#top">Back to Top</a>, do đó, nếu bạn cần thay thế cài đặt mặc định thì nó vẫn nhanh chóng và dễ dàng.

Nếu bạn có một ý tưởng tốt về những gì nội dung của dự án sẽ, và việc sử dụng các URL và các liên kết của nó là hoàn toàn dưới sự kiểm soát của bạn, bạn có thể thấy thẻ <base> giúp bạn tiết kiệm rất nhiều thời gian.

Đọc thêm về <base> tại W3C wiki và đặc tả HTML5:

Liên quan

Ethernet Switch Có Chức Năng Gì? - Xem 22,869

Ethernet Switch có chức năng gì? Switch là một thiết bị chọn lựa đường dẫn để gửi frame đến đích, hoạt động ở Lớp 2 của mô hình OSI. Đôi khi Switch còn được gọi là Bridge đa port hay Hub chuyển mạch. Switch quyết định chuyển frame dựa trên ... Nếu có hai máy trạm được thiết lập phiên kết nối thì chúng sẽ sử dụng một lượng băng thông đáng kể và hoạt động của các thiết bị còn lại kết nối vào Hub sẽ bị giảm xuống. Để giải quyết tình trạng trên, Switch xử lý mỗi cổng là một đoạn mạng (segment) riêng biệt. Khi các máy ở các cổng khác nhau cần liên lạc với nhau, Switch sẽ chuyển frame từ cổng này sang cổng kia và


Oxit Axit Là Gì? Tính Chất Hóa Học Và Hướng Dẫn Bài Tập Oxit Axit - Xem 19,404

Oxit axit là các oxit khi tác dụng với nước sẽ tạo ra axit, tác dụng với kiềm tạo thành muối hóa học. Oxit axit thường là oxit của phi kim ứng với một axit hoặc kim loại có hóa trị cao. Vậy tính chất hóa học của oxit axit ... Oxit axit thường là oxit của phi kim ứng với một axit hoặc kim loại có hóa trị cao. Vậy tính chất hóa học của oxit axit là gì? Cách giải bài tập oxit axit tác dụng với bazo như thế nào? Cách gọi tên oxit axit Tên oxit axit: (Tên tiền tố chỉ số nguyên tử của phi kim) + Tên phi kim + (tên tiền tố chỉ số nguyên tử oxi) + ''Oxit'' Tính chất hóa học của oxit axit Trừ SiO 2 thì hầu hết các oxit axit


Giải Vbt Vật Lý Lớp 6 - Xem 16,335

Giải bài tập môn Vật lý 6 Giải VBT Vật lý lớp 6 – Bài 8: Trọng lực – Đơn vị lực là tài liệu tham khảo môn Vật lý 6 hay dành cho các em học sinh, giúp các em ôn tập và củng cố kiến thức đã học ... Chuyển động của nó đã bị biến đổi. Vậy phải có một lực hút viên phấn xuống phía dưới. Lực này do Trái Đất tác dụng lên viên phấn. II - PHƯƠNG VÀ CHIỀU CỦA TRỌNG


Drama Là Gì ? Ý Nghĩa Của Từ Drama Trên Facebook Là Gì? - Xem 16,236

Xã hội ngày càng phát triển kéo theo nhiều trào lưu xuất hiện, các thuật ngữ, ngôn từ mới lạ ngày càng nhiều trên các mạng. Những nội dung, các câu chuyện có tính chất kịch tính, gay cấn kéo dài luôn dành được sự quan tâm của các bạn ... Nhân vật chính trong câu chuyện đến bước đường cùng. Ví dụ như vụ câu chuyện nữ sinh chia tay bạn trai bị phát tán clip quan hệ trên mạng. Để lại hậu quả đó là nữ sinh không chịu nổi dư luận mà chọn kết thúc cuộc sống bằng cách tự


Đa Dạng Sinh Học Là Gì? Nguyên Nhân, Biện Pháp Hạn Chế Suy Giảm Đa Dạng Sinh Học - Xem 12,771

Đa dạng sinh học là sự phong phú của nhiều nhiều dạng, loài và các biến dị di truyền của mọi sinh vật trong đời sống tự nhiên, sự đa dạng và phong phú này được chia làm nhiều cấp độ tổ chức sinh giới đặc biệt là với các ... Các bạn có thể tìm hiểu thêm khái niệm đa dạng sinh học là gì, giá trị đa dạng sinh học cũng như nguyên nhân và biện pháp cụ thể để hạn chế suy giảm đa dạng sinh học trong bài viết dưới đây! Thế nào là đa dạng sinh học? Đa dạng sinh học là bao gồm nhiều dạng và cá thể của các loài cùng với những biến dị di truyền của thế giới sinh vật, cũng như nhiều dạng của các cấp độ


Kimochi Yamate Là Gì? Ý Nghĩa Của I Cư Kimochi Yamete Trong Tiếng Nhật? - Xem 12,375

Kimochi Yamate hay i cư kimochi và i kư kimochi là những thuật ngữ, cụm từ được sử dụng khả phổ biến trong thời đại hiện nay. Nhưng bạn có thật sự hiểu được nghĩa của từ kimochi là gì? Ở bài viết dưới đây, Zdungk.com sẽ giải đáp toàn ... Và được sử dụng nhiều với hàm nghĩ khi mà nam giới thoả mãn bạn giới của mình và ngược lại. Cho nên khi sử dụng kimochi trong ngữ cảnh này khá nhạy cảm nên các bạn trẻ nên lưu ý khi sử dụng để tránh gây khiếm nhã nhé. Tại sao các bạn trẻ lại thường xuyên sử dụng kimochi với hàm nghĩa trên? Đây là điều hoàn toàn dễ hiểu bởi chúng ta thường biết rằng, Nhật Bản là nơi có


Z Là Gì Trong Toán Học? - Xem 11,385

Bạn có từng nghe về tập hợp R trong toán học chưa? Hẳn là rất rất quen phải không? Dĩ nhiên rồi vì lớp 6 lớp 7 chúng ta được học cái này mà. Vậy Z là gì trong toán học nhỉ? “Tập hợp Z là tập hợp các số ... Tương tự như các tập hợp số khác, tập hợp Z cũng là một tập hợp vô hạn. Ví dụ về các bài toán sử dụng tập hợp z- (số nguyên) Trong toán học, các dạng bài tập về số nguyên thường rất đa dạng. Nhưng loại tập hợp này thường chỉ được ra điều kiện trong một bài toán khó. Hoặc ở các chương trình nhỏ hơn chẳng hạn toán lớp 6, số nguyên lại được sử dụng như một bài toán


Tb Là Gì Trên Facebook? - Xem 11,088

TB nghĩa là gì? TB là viết tắt của từ gì? TB là 1 từ viết tắt có rất nhiều nghĩa tiếng việt và tùy từng ngữ cảnh mà ta hiểu nó sẽ có nghĩa là gì, dưới đây là các nghĩa hay được sử dụng nhất của từ viết ... Đơn vị này cao cấp hơn Gigabyte - GB. 1 TB = 1024 GB 5 TB = 5120 GB 10 TB = 10240 GB Ví dụ: Bạn có ổ cứng dung lượng 2 TB tức là ổ cứng của bạn bằng 2048 GB Một bộ phim, thư mục, video có dung lượng 1TB tức là 1048 GB -phim HD dung lượng cao. Vậy nếu bạn thấy đứng đằng trước TB là 1 con số thì nó thường là viết tắt của cụm từ Terabyte TB trên Facebook nghĩa là gì? Đối với


Mã Zip Iphone Là Gì? - Xem 10,494

Zip Code (mã zip) là một trong những khái niệm không quá xa lạ đối với thế hệ trẻ. Chúng liên quan trực tiếp tới quy trình giao – Nhận bưu kiện khi mua sắm online hay đặt hàng thông qua các ứng dụng giao dịch trực tuyến. Không chỉ ... Chúng liên quan trực tiếp tới quy trình giao - Nhận bưu kiện khi mua sắm online hay đặt hàng thông qua các ứng dụng giao dịch trực tuyến. Không chỉ vậy, mã zip còn xuất hiện trong các dòng sản phẩm iPhone hiện đại nhất. Vậy, mã zip iPhone là gì? Hãy cùng tìm hiểu nhé. Mã Zip Code là gì? Zip Code (Postcode - Zipcode) là một dãy số được sắp xếp theo quy tắc nhất định và được quy định bởi tổ


Số Cvv/cvc Trên Thẻ Atm Vietcombank Là Gì? - Xem 10,197

Số Cvv/Cvc trên thẻ atm đang được rất nhiều chủ thẻ quan tâm. Nhất là với những người dùng thẻ atm Vietcombank. Vậy số Cvv/Cvc trên thẻ atm vietcombank là gì? Bị lộ có sao không? Số Cvv/Cvc trên thẻ atm vietcombank là gì? Không phải ai dùng thẻ atm ... Tốt hơn hết là không nên đưa thẻ tín dụng của mình cho người khác dù chỉ trong thời gian ngắn. Nhất là không chụp ảnh thẻ tín dụng của mình để gửi cho ai cả. Nếu chẳng may rơi vào tay kẻ xấu hay tin


Đề xuất

Paypal Là Gì? Hướng Dẫn Đăng Ký Tài Khoản Paypal - Xem 3,762

Công cụ thanh toán trực tuyến không những giúp cho việc mua sắm của bạn qua mạng internet dễ dàng hơn mà còn giúp bạn thanh toán các dịch vụ trong nước cũng như quốc tế một cách đơn giản, nhanh chóng và an toàn. Trong bài viết này tôi ... (Chẳng hạn gửi $100 sẽ mất $4.7) Phí rút tiền cao: Để có thể rút tiền từ Paypal về ngân hàng Việt Nam thì chi phí là 60k cho mỗi lần rút. Ngoài ra đối khi nó còn bị chênh lệch tỉ giá USD, thường thấp hơn 800đ so với giá USD thị trường. Số tiền rút tối thiểu là $10. Bị khóa tài khoản: Ở Việt Nam, rất nhiều người dùng Paypal để rửa tiền, nhận tiền từ những phương pháp cheat,


Giá Trị Của Tình Yêu Thương Trong Cuộc Sống - Xem 5,049

Có nhiều người cho rằng, được sinh ra trên thế giới này đã là niềm hạnh phúc lớn lao. Chỉ cần ấm no, tiền tài dư giả thì sẽ là hạnh phúc. Tuy nhiên, cuộc sống sẽ không thể nào trọn vẹn nếu thiếu đi 2 từ “yêu thương”. Chúng ... Thay vào đó, yêu thương dường như bị gán mác với sự toan tính, lừa lọc và đề phòng. Chính những lý do này khiến cuộc sống này còn nhiều hoàn cảnh ngang trái, còn nhiều người khó khăn đang ngày đêm mong ngóng nhận được một chút


Oppa Là Gì? Và Cách Sử Dụng Oppa Sao Cho Đúng Nhất !!! - Xem 2,475

“Oppa” là thuật ngữ được giới trẻ hiện hay sử dụng rất nhiều. Chúng ta thường thấy những bạn nữ thường gọi những thần tượng, những người đàn ông mà họ yêu quý là “Oppa”, Thậm chí họ còn lưu trong danh bạ với các tên gọi cùng ký tự ... Đôi khi bạn sử dụng nhiều khiến người đối diện cảm thấy bị mất hứng và không muốn chia sẻ với bạn thêm bất cứ vấn đề gì cả. "Oppa" là một từ ngữ mang lại hiệu ứng cực kỳ tốt trong giao tiếp. Nhưng không phải vì thế mà


Cc Là Gì? Cc Được Dùng Như Thế Nào Trong Các Lĩnh Vực Trong Cuộc Sống? - Xem 3,069

CC là gì? CC được dùng như thế nào trong các lĩnh vực gửi thư Email, trong cuộc sống… Hãy cùng chúng tôi tìm hiểu về CC trong bài viết sau. CC được viết tắt từ carbon copy có nghĩa là các bản sao. CC được dùng nhiều trong việc ... CC được dùng nhiều trong việc gửi thư email, với mục đích gửi thêm một bản sao ở email mình cho nhiều người. Ngoài ra, CC còn được dùng trong trong một số ngành như: Vật lý, trên facebook, trong game và trên các loại xe. Trong đó: CC trong Vật lý được


Cách Xưng Hô Thời Phong Kiến - Xem 3,168

I, Trong hoàng thất - Cha vua (người cha chưa từng làm vua) : Quốc lão- Cha vua (người cha đã từng làm vua rồi truyền ngôi cho con) : Thái thượng hoàng- Mẹ vua (chồng chưa từng làm vua) : Quốc mẫu- Mẹ vua (chồng đã từng làm vua) ... Xưng hô: (không viết hoa)- Vua tự xưng :+ quả nhân: dùng cho tước nào cũng được.+ trẫm: chỉ cho Hoàng đế/Vương.+ cô gia: chỉ dùng cho Vương trở xuống.- Vua gọi các quần thần : chư khanh, chúng khanh- Vua gọi cận thần (được sủng ái) : ái khanh- Vua


Bạn đang xem bài viết Chỉ Dẫn Nhanh: Thiết Lập Url Tương Đối Với Thẻ “base” trên website Zdungk.com. Hy vọng những thông tin mà chúng tôi đã chia sẻ là hữu ích với bạn. Nếu nội dung hay, ý nghĩa bạn hãy chia sẻ với bạn bè của mình và luôn theo dõi, ủng hộ chúng tôi để cập nhật những thông tin mới nhất. Chúc bạn một ngày tốt lành!