HTML 文件的注釋
HTML 注釋標(biāo)簽是在 HTML 源代碼中添加說(shuō)明/注釋,使用該標(biāo)簽注釋的內(nèi)容將不在瀏覽器中顯示。
邊寫(xiě)代碼邊寫(xiě)注釋是一個(gè)好習(xí)慣,特別是代碼量很大的時(shí)候,如果不寫(xiě)注釋,你寫(xiě)完倒回去看可能都不知道自己寫(xiě)的什么了。
如果是團(tuán)隊(duì)合作,就更應(yīng)該寫(xiě)注釋了,如果不寫(xiě)每人知道你寫(xiě)的什么,還需要從頭到尾仔細(xì)看一遍。
團(tuán)隊(duì)可以自行約定注釋標(biāo)準(zhǔn)及規(guī)范,例如:
- 所有的注釋寫(xiě)在內(nèi)容上方;
- 如果有多句注釋,每一句注釋直接換行;
- 如果是方法注釋,寫(xiě)明方法作用和每個(gè)參數(shù)介紹;
- 注釋的語(yǔ)句簡(jiǎn)單明了;
- 每個(gè)變量和方法標(biāo)注作用。
1. 什么是注釋
注釋指解釋字句的文字,也指用文字解釋字句。當(dāng)我們需要給代碼做批注,我們就需要注釋代碼。
注釋是我們提高代碼可讀性,代碼可維護(hù)性最簡(jiǎn)單有效的方式,往往多寫(xiě)幾個(gè)字,會(huì)給我們?nèi)蘸蟮木S護(hù),減少很大的難度。
2. 注釋的作用
代碼注釋不僅方便程序員自己回憶起以前代碼的用途,還可以幫助其他程序員很快的讀懂你的程序的功能,方便多人合作開(kāi)發(fā)網(wǎng)頁(yè)代碼。
3. 如何在 HTML 文件中書(shū)寫(xiě)注釋
在 HTML
文件中, 我們將注釋寫(xiě)在<!-- -->
中,注釋只是起解釋作用,并不會(huì)在頁(yè)面上顯示出來(lái)。
我們?nèi)绻褂镁庉嬈骶帉?xiě)代碼,如 VSCode, WebStorm 等,那么在編輯器書(shū)寫(xiě)注釋的快捷方式為 ctrl
+ /
, 我們只需要先寫(xiě)注釋內(nèi)容, 然后在選中注釋內(nèi)容,按 ctrl
+ /
即可。
4. 經(jīng)驗(yàn)分享
1. 注釋可以寫(xiě)在 HTML 文件的任意位置。
<!DOCTYPE HTML>
<HTML lang="en">
<head>
<meta charset="UTF-8">
<!-- HTML注釋可以在head標(biāo)簽中 -->
<title>HTML注釋</title>
</head>
<body>
<!-- HTML注釋也可以在body標(biāo)簽中 -->
<h1>我是一個(gè)大標(biāo)題</h1> <!-- HTML注釋也可以在標(biāo)簽后面 -->
</body>
</HTML>
2. 注釋內(nèi)容必須寫(xiě)在<!-- -->
中,否則不會(huì)生效。
<!DOCTYPE HTML>
<HTML lang="en">
<head>
<meta charset="UTF-8">
<title>HTML注釋</title>
</head>
<body>
<!-- --> HTML注釋也可以在body標(biāo)簽中(此段內(nèi)容沒(méi)有在<!-- -->中,則不為注釋,而是頁(yè)面上的內(nèi)容)
<h1>我是一個(gè)大標(biāo)題</h1> <!-- 只有寫(xiě)在規(guī)定位置,才是注釋 -->
</body>
</HTML>
3. 注釋的內(nèi)容只是解釋,并不會(huì)實(shí)際的顯示在頁(yè)面上。
<!DOCTYPE HTML>
<HTML lang="en">
<head>
<meta charset="UTF-8">
<title>HTML注釋</title>
</head>
<body>
<!-- 注釋的內(nèi)容不會(huì)顯示在頁(yè)面上-->
<h1>我是一個(gè)大標(biāo)題</h1>
</body>
</HTML>
4. 編寫(xiě)代碼時(shí),盡量把注釋寫(xiě)的簡(jiǎn)單明了,通俗易懂,不僅方便自己維護(hù)代碼,也方便與他人的協(xié)同開(kāi)發(fā)。
<!DOCTYPE HTML>
<HTML lang="en">
<head>
<meta charset="UTF-8">
<title>HTML注釋</title>
</head>
<body>
<!-- 這是頭部 -->
<header></header>
<!-- 這是大標(biāo)題-->
<h1>我是一個(gè)大標(biāo)題</h1>
</body>
</HTML>
5. 注釋標(biāo)簽可以自定義內(nèi)容,也可以注釋已寫(xiě)的HTML標(biāo)簽。
<!DOCTYPE HTML>
<HTML lang="en">
<head>
<meta charset="UTF-8">
<title>HTML注釋</title>
</head>
<body>
<!-- 自定義注釋內(nèi)容 -->
<p>這是一段話</p>
<!-- 注釋HTML標(biāo)簽, 則該標(biāo)簽也不會(huì)在頁(yè)面上顯示 -->
<!-- <h1>我是一個(gè)大標(biāo)題</h1> -->
</body>
</HTML>
6. 開(kāi)發(fā)人員一定要養(yǎng)成書(shū)寫(xiě)注釋的好習(xí)慣。
5. 真實(shí)案例分享
簡(jiǎn)書(shū)官網(wǎng)
<!-- 正常登錄登錄名輸入框 -->
<div >
<input placeholder="手機(jī)號(hào)或郵箱" type="text" />
</div>
<!-- 海外登錄登錄名輸入框 -->
<div >
<input placeholder="密碼" type="password" />
</div>
6. 小結(jié)
- 注釋只是起一個(gè)批注解釋作用,并不會(huì)在頁(yè)面上產(chǎn)生實(shí)際的內(nèi)容。
- HTML文件中注釋寫(xiě)在
<!-- -->
中。