一:a標籤詳解
<a> 標籤定義超鏈接,用於從一個頁面鏈接到另一個頁面。<a> 元素最重要的屬性是 href 屬性,它指定鏈接的目標。
在所有瀏覽器中,鏈接的默認外觀如下:未被訪問的鏈接帶有下劃線而且是藍色的、已被訪問的鏈接帶有下劃線而且是紫色的、活動鏈接帶有下劃線而且是紅色的
提示:如果沒有使用 href 屬性,則不能使用 hreflang、media、rel、target 以及 type 屬性、通常在當前瀏覽器窗口中顯示被鏈接頁面,除非規定了其他 target、請使用 CSS 來改變鏈接的樣式。
charset | char_encoding | HTML5 不支持。規定目標 URL 的字符編碼。 |
coords | coordinates | HTML5 不支持。規定鏈接的座標。 |
downloadNew | filename | 指定下載鏈接 |
href | URL | 規定鏈接的目標 URL。 |
hreflang | language_code | 規定目標 URL 的基準語言。僅在 href 屬性存在時使用。 |
mediaNew | media_query | 規定目標 URL 的媒介類型。默認值:all。僅在 href 屬性存在時使用。 |
name | section_name | HTML5 不支持。規定錨的名稱。 |
rel | alternate author bookmark help license next nofollow noreferrer prefetch prev search tag |
規定當前文檔與目標 URL 之間的關係。僅在 href 屬性存在時使用。 |
rev | text | HTML5 不支持。規定目標 URL 與當前文檔之間的關係。 |
shape | default rect circle poly |
HTML5 不支持。規定鏈接的形狀。 |
target | _blank _parent _self _top framename |
規定在何處打開目標 URL。僅在 href 屬性存在時使用。
|
typeNew | MIME_type | 規定目標 URL 的 MIME 類型。僅在 href 屬性存在時使用。 注:MIME = Multipurpose Internet Mail Extensions。 |
ownload 屬性定義了下載鏈接的地址、href 屬性必須在 <a> 標籤中指定、屬性同樣可以指定下載文件的名稱。文件名稱沒有限定值,瀏覽器會自動在文件名稱末尾添加該下載文件的後綴 (.img, .pdf, .txt, .html, 等)。
二:a標籤應用
<a target="_blank" href={record.fileUrl}>
預覽
</a>
<a
href={record.fileUrl + '?isDown=true'}
target="_blank"
download={
`${record.fileName}xxname.png`
}
>
下載
</a>
可作爲預覽與下載使用
但是判定是否下載需配置Header type中的Content-Disposition
Content-Disposition
Content-Disposition
響應頭指示回覆的內容該以何種形式展示,是以
內聯的形式(即網頁或者頁面的一部分),還是以
附件的形式下載並保存到本地。
在 multipart/form-data 類型的應答消息體中,Content-Disposition
消息頭可以被用在 multipart 消息體的子部分中,用來給出其對應字段的相關信息。各個子部分由在Content-Type
中定義的分隔符分隔。用在消息體自身則無實際意義。
Content-Disposition 消息頭最初是在 MIME 標準中定義的,HTTP 表單及 POST
請求只用到了其所有參數的一個子集。只有 form-data
以及可選的 name
和 filename
三個參數可以應用在HTTP場景中。
Content-Disposition
響應頭指示回覆的內容該以何種形式展示,是以
內聯的形式(即網頁或者頁面的一部分),還是以
附件的形式下載並保存到本地。
在 multipart/form-data 類型的應答消息體中,Content-Disposition
消息頭可以被用在 multipart 消息體的子部分中,用來給出其對應字段的相關信息。各個子部分由在Content-Type
中定義的分隔符分隔。用在消息體自身則無實際意義。
Content-Disposition 消息頭最初是在 MIME 標準中定義的,HTTP 表單及 POST
請求只用到了其所有參數的一個子集。只有 form-data
以及可選的 name
和 filename
三個參數可以應用在HTTP場景中。
作爲消息主體中的消息頭
在 HTTP 場景中,第一個參數或者是 inline
(默認值,表示回覆中的消息體會以頁面的一部分或者整個頁面的形式展示),或者是 attachment
(意味着消息體應該被下載到本地;大多數瀏覽器會呈現一個“保存爲”的對話框,將 filename
的值預填爲下載後的文件名,假如它存在的話)。
Content-Disposition: inline
Content-Disposition: attachment
Content-Disposition: attachment; filename="filename.jpg"
在 HTTP 場景中。第一個參數總是固定不變的 form-data
;附加的參數不區分大小寫,並且擁有參數值,參數名與參數值用等號('='
)連接,參數值用雙引號括起來。參數之間用分號(';'
)分隔。
Content-Disposition: form-data
Content-Disposition: form-data; name="fieldName"
Content-Disposition: form-data; name="fieldName"; filename="filename.jpg"