HTML
HyperText Markup Language
超文本編標(biāo)記語言是構(gòu)成 Web 世界的一磚一瓦康聂。它描述并定義了一個網(wǎng)頁的內(nèi)容和基本布局续膳。
關(guān)于 HTML 標(biāo)簽
詳見 MDN Web 文檔
關(guān)于 <iframe> 標(biāo)簽
frameborder 屬性
- frameborder 默認(rèn)值為 1
- 實現(xiàn) frame 無邊框
<iframe frameborder="0">
name 屬性
該名稱可以用作 <a> 標(biāo)簽睬愤，<form> 標(biāo)簽的 target 屬性值加矛，或<input> 標(biāo)簽和 <button> 標(biāo)簽的 formtaget 屬性值稳懒，實現(xiàn)在 iframe 里顯示目標(biāo)頁面舌菜。
關(guān)于 <a> 標(biāo)簽
跳轉(zhuǎn)頁面時，發(fā)起的是 HTTP GET 請求澈蚌。
href 屬性
包含超鏈接指向的 URL 或 URL 片段摹芙。
關(guān)于 href="qq.com"
<a href="qq.com" >是否能打開 qq.com ？</a>
qq.com 是個相對地址宛瞄，識別為文件路徑浮禾，無法打開。
那應(yīng)該怎么寫份汗？如下盈电。
- 添加協(xié)議
<a >qq.com</a>
<a >qq.com</a>
- 利用
<a>的自動繼承協(xié)議，結(jié)合http-sever工具或github pages預(yù)覽來實現(xiàn)http://或https://協(xié)議
<a >qq.com</a>
關(guān)于路徑
--index.html--- //地址為 127.0.0.1:8080
<a href="xxx.html" >點擊會鏈接到何處杯活？</a>
鏈接到 127.0.0.1:8080/xxx.html
關(guān)于 #錨點
觀察瀏覽器地址欄
<a >觀察瀏覽器地址欄</a>
鏈接返回到頁面頂部
<a >鏈接返回到頁面頂部</a>
<a >鏈接返回到頁面頂部</a>
關(guān)于 ? 請求
<a >發(fā)起請求</a>
控制臺查看請求與響應(yīng) name:leown
關(guān)于偽協(xié)議
彈出 alert 對話框 “1”
<a href="javascript:alter(1)" >偽協(xié)議彈出對話框 “1”</a>
實現(xiàn)空鏈接
<a href="javascript:;" >空鏈接</a>
target 屬性
指定在何處顯示鏈接的資源匆帚。
_self: 當(dāng)前頁面加載。
_blank: 新窗口打開旁钧。
_parent: 加載響應(yīng)到當(dāng)前框架父框架卷扮。如果沒有parent框架此選項的行為方式相同_self荡澎。
_top:加載響應(yīng)到頂層窗口，取消所有其它frame晤锹。
download 屬性
此屬性指示瀏覽器下載URL而不是導(dǎo)航到它
<a download>Download Git</a>
注意添加 download 后的請求與響應(yīng)摩幔，在 Response Headers 中，Content-Type 的值為 application/octet-stream
關(guān)于 <form> 標(biāo)簽
關(guān)于 target 屬性
和 <a> 標(biāo)簽相同
請求
- 關(guān)于
<form>標(biāo)簽的請求鞭铆，可通過開發(fā)者工具自行調(diào)試查看或衡；
<!-- 一個簡單的表單，這個表單會發(fā)送一個 GET 請求 -->
<form action="">
<label for="GET-name">Name:</label>
<input id="GET-name" type="text" name="name">
<input type="submit" value="Save">
</form>
<!-- 一個簡單的表單车遂，發(fā)送 POST 請求 -->
<form action="" method="post">
<label for="POST-name">Name:</label>
<input id="POST-name" type="text" name="name">
<input type="submit" value="Save">
</form>
<!-- 使用 fieldset, legend, and label 的表單 -->
<form action="" method="post">
<fieldset>
<legend>Title</legend>
<input type="radio" name="radio" id="radio"> <label for="radio">Click me</label>
</fieldset>
</form>
- 關(guān)于提交數(shù)據(jù)的查看
<form action="user">
username:<input name="username" type="text"> //填入 leown
password:<input name="password" type="password"> //填入 123123
<button>submit</button>
</form>
在控制臺可以看到提交的數(shù)據(jù) leown 和 123123封断。
注意
- 如果
method = "get"我們的提交的數(shù)據(jù)會出現(xiàn)在 HTTP GET 請求第二部分的查詢參數(shù)中； - 如果
method = "post"我們的提交的數(shù)據(jù)會出現(xiàn)在 HTTP POST請求的第四部分中舶担； - 我們可以通過在
action的值后面加上查詢數(shù)據(jù)xxx=123坡疼， 使xxx=123出現(xiàn)在 HTTP POST 請求的第二部分的查詢參數(shù)中； - 我們無法使 HTTP GET 請求擁有第四部分衣陶；
關(guān)于 <button> 標(biāo)簽 和 <input> 標(biāo)簽
詳見 MDN Web 文檔
注意
- 當(dāng)一個
form表單中沒有submit按鈕柄瑰，button沒有寫type值，則此button按鈕自動升級為submit按鈕剪况；而如果寫了type值教沾，則不自動升級； - 點擊表單文字即可選中
input標(biāo)簽的方法译断；
<label >user: <input type="text" ></label>
<label for="xxx">user: </label><input type="text" id="xxx" >
- 通過多個
radio標(biāo)簽有的name值相同來實現(xiàn)單選授翻； -
select標(biāo)簽的multiple屬性實現(xiàn)多選，option標(biāo)簽的disable屬性實現(xiàn)不可選孙咪，selected屬性實現(xiàn)默認(rèn)選擇堪唐； -
textarea屬性用 CSS 來精確實現(xiàn)寬高
