HTML DOM link rel 屬性
HTML DOM link rel 屬性設定/返回當前文件和連結文件之間的關係,必須提及。
語法
以下是語法:
- 返回 **rel** 屬性值
linkObject.rel
- 將 **rel** 設定為 valueString
linkObject.rel = valueString
值字串
這裡,**“valueString”** 可以是以下內容:
| valueString | 描述 |
|---|---|
| alternate | 它提供 |
| author | 它提供連結文件作者的連結 |
| dnsprefetch | 它指定瀏覽器應該為目標資源的來源預先執行 DNS 解析 |
| help | 如果存在,它提供指向幫助文件的連結 |
| icon | 它匯入一個圖示來表示文件 |
| rel | 它設定/返回當前文件和連結文件之間的關係 |
| license | 它提供連結文件的版權資訊 |
| next | 它提供指向文件系列中下一個文件的連結 |
| pingback | 它提供處理對當前連結文件的 pingback 的 pingback 伺服器的地址 |
| preconnect | 它指定瀏覽器應該預先連線到目標資源的來源(如果存在) |
| prefetch | 它指定瀏覽器應該預先獲取和快取目標資源,因為它需要後續文件導航 |
| preload | 它指定瀏覽器代理必須根據“as”屬性(以及與該目標關聯的優先順序)提供的目標,預先獲取並快取目標資源以進行當前導航。 |
| prerender | 它指定瀏覽器應該在後臺載入指定的網頁。因此,如果使用者導航到此頁面,它會加快頁面載入速度 |
| prev | 它表示文件是系列的一部分,並且該系列中的前一個文件是引用的連結文件 |
| search | 它提供指向可用於搜尋當前文件及其相關頁面的資源的連結。 |
| stylesheet | 它在當前文件中匯入樣式表 |
示例
讓我們來看一個 **Link rel** 屬性的示例:
<!DOCTYPE html>
<html>
<head>
<title>Link rel</title>
<link id="extStyle" rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<form>
<fieldset>
<legend>Link-rel</legend>
<div id="divDisplay"></div>
</fieldset>
</form>
<script>
var divDisplay = document.getElementById("divDisplay");
var extStyle = document.getElementById("extStyle");
if(extStyle.rel === 'stylesheet')
divDisplay.textContent = 'The linked document is of type stylesheet';
else
divDisplay.textContent = 'The linked document is of type '+extStyle.rel;
</script>
</body>
</html>在上面的示例中,**‘style.css’** 包含:
form {
width:70%;
margin: 0 auto;
text-align: center;
}
* {
padding: 2px;
margin:5px;
}
input[type="button"] {
border-radius: 10px;
}輸出
這將產生以下輸出:

廣告
資料結構
網路
關係資料庫管理系統 (RDBMS)
作業系統
Java
iOS
HTML
CSS
Android
Python
C語言程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP