整合營銷服務商
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
例
HTML 注釋：
<!--這是一個注釋，注釋在瀏覽器中不會顯示--><p>這是一個段落</p>
瀏覽器支持
所有主流瀏覽器都支持 <!--...--> 注釋標簽。
標簽定義及使用說明
<!--...--> 注釋標簽用來在源文檔中插入注釋。注釋不會在瀏覽器中顯示。
您可使用注釋對您的代碼進行解釋，這樣做有助于您在以后的時間對代碼的編輯。特別是代碼量很大的情況下很有用。
您也可以在注釋內容存儲針對程序所定制的信息。在這種情況下，這些信息對用戶是不可見的，但是對程序來說是可用的。一個好的習慣是把注釋或樣式元素放入注釋文本中，這樣就可避免不支持腳本或樣式的老瀏覽器把它們顯示為純文本。
<scripttype="text/javascript"><!--functiondisplayMsg(){alert("Hello World!")}//--></script>
注釋：命令行最后的兩個正斜杠（//）是 JavaScript 注釋符號。這確保了 JavaScript 不會執行 --> 標簽。
除了在源文檔中有非常明顯的作用外，許多 Web 服務器也利用注釋來實現文檔服務端軟件特有的特性。這些服務器可以掃描文檔，從傳統的 HTML/XHTML 注釋中找到特定的字符序列，然后再根據嵌在注釋中的命令采取相應的動作。這些動作可能是簡單的包括其他文件中的文本（即所謂的服務器端包含，server-inside include），也可能是復雜地執行其他命令去動態生成文檔的內容。
HTML 4.01 與 HTML5之間的差異
無。
標準屬性
<!--...--> 注釋標簽不支持任何標準屬性。
如需更多有關 HTML 標準屬性的信息，請訪問 標準屬性。
事件屬性
<!--...--> 注釋標簽不支持任何事件屬性。
如需更多有關 HTML 事件屬性的信息，請訪問 事件屬性。
如您還有不明白的可以在下面與我留言或是與我探討QQ群308855039，我們一起飛！
HTML標題通過<h1>-<h6>
標題大小與字體大小的關系：1到6號標題與1到6號字體是逆序對應
實例：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>文檔標題</title>
</head>
<body>
<h1>標題1</h1>
<h2>標題2</h2>
</body>
</html>HTML段落是通過標簽<p>來定義
實例：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>文檔標題</title>
</head>
<body>
<p>段落1</p>
<p>段落2</p>
</body>
</html>HTML鏈接是通過標簽<a>來定義的
實例：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>文檔標題</title>
</head>
<body>
<a href = "https://www.baidu.com"> 這是一個鏈接</a>
</body>
</html>HTML通過標簽<img>來定義
實例：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>文檔標題</title>
</head>
<body>
<img src="/images/logo.png" width="258" height="39" />
</body>
</html>大多數HTML元素的屬性：
屬性 | 描述 |
class | 為html元素定義一個或多個類名（classname）(類名從樣式文件引入) |
id | 定義元素的唯一id |
style | 規定元素的行內樣式（inline style） |
title | 描述了元素的額外信息 (作為工具條使用) |
<hr>標簽在HTML頁面中創建水平線
hr元素可用于分隔內容
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>文檔標題</title>
</head>
<body>
<p>hr 標簽定義水平線：</p>
<hr />
<p>這是段落。</p>
<hr />
<p>這是段落。</p>
<hr />
<p>這是段落。</p>
</body>
</html>運行結果：
可以將注釋插入 HTML 代碼中，這樣可以提高其可讀性，使代碼更易被人理解。瀏覽器會忽略注釋，也不會顯示它們。
注釋寫法如下：
<!-- 這是一個注釋 -->
寫個HTML標準文檔結構
<!DOCTYPE html> <html> <head> <title>HTML代碼一般結構</title> <style type="text/css"> /*我是被注釋掉了的css代碼*/ </style> </head> <body> <p>我是蘇逗逗</p> <!-- <span>我是被注釋掉了的HTML代碼</span> --> <script type="text/javascript"> /*我是被注釋掉了的javascript代碼*/ </script> </body> </html>
寫了一段事件的代碼，發現自己的前端基礎還是不夠牢，于是就重新回到起點，復習下基礎知識。
先學第一個標簽吧，<!--...-->
眾所周知，這是HTML代碼內部的注釋標簽。它的作用就是讓我們寫的代碼不被瀏覽器解析。
一般來說，這個標簽的應用范圍除了style標簽和script標簽內部以外的所有位置。因為這兩個標簽內部有自己的注釋標簽，如上面代碼所示。
這里有個很有意思的事情，之前為了解決舊瀏覽器不支持script的情況，然后出現了下方類型的寫法：
<script type="text/javascript">
<!--
function displayMsg()
{
alert("Hello World!")
}
//-->
</script>
舊的瀏覽器會看到兩個不支持的標簽和一個注釋。這里的//也被舊瀏覽器視為被注釋掉的代碼內容的一部分。
新的瀏覽器是可以看到JS代碼。新瀏覽器中的JavaScript引擎將字符<!--視為單行注釋的開始。
//由于是在script代碼的前面，表示script的單行注釋，于是后面的-->也會被視為注釋內容。
然后新瀏覽器就可以正常識別這樣的代碼，舊瀏覽器識別為兩個不認識的標簽，內容為空（因為被注釋掉了），所以這部分內容就會在頁面上被忽略了。
下面說說標簽常常用到的的標準屬性和事件屬性，我得復習幾個基礎概念。
HTML其實就是超文本標記語言 (Hyper Text Markup Language)的縮寫。
標記語言是一套標記標簽 (markup tag)
HTML 標記標簽通常被稱為 HTML 標簽 (HTML tag)。其實就是簡稱了。
HTML 元素指的是從開始標簽（start tag）到結束標簽（end tag）的所有代碼。
HTML 文檔包含 HTML 標簽和純文本。HTML 文檔一般是由多個HTML 元素嵌套或者平行組成的內容。
Web 瀏覽器的作用是讀取 HTML 文檔，并以網頁的形式顯示出它們。瀏覽器不會顯示 HTML 標簽，而是使用標簽來解釋頁面的內容。這個和開頭的那個script例子正好呼應。
下面是關于HTML 標簽屬性的知識。
HTML 標簽可以擁有屬性。屬性提供了有關 HTML 元素的更多的信息。屬性總是以名稱/值對的形式出現，比如：name="value"。屬性總是在 HTML 元素的開始標簽中規定。
比如：
<a >這是我的網站，雖然沒錢租服務器，訪問不了。。。</a>
HTML 鏈接由 <a> 標簽定義。鏈接的地址在 href 屬性中指定。
這里需要注意的是，屬性值應該始終被包括在引號內，屬性和屬性值對大小寫不敏感，不過，推薦使用小寫的屬性/屬性值。
對于所有的標簽來說，都會有幾個通用的屬性值，我們叫他HTML 全局屬性，比如id，class等。
這里的全局屬性一般是給HTML標簽添加css樣式用的。所以，屬性值的走向一般都到了css樣式表文件或者是就在標簽內部實現了樣式改變。
另外，對于input之類的表單元素，我們常常會遇到失去焦點等情況，所以，這里在HTML標簽引進了HTML 事件屬性。
body標簽常用的幾個事件屬性：onload，onresize，
form 元素常用的幾個事件屬性：onblur，onfocus，onchange等等。
另外就是鍵盤和鼠標事件了，這里的鍵盤事件，我感覺還是離不開input輸入框這樣的標簽了，因為，一般只有輸入框才會觸發，鍵盤按下的事件吧。
常用的三個鍵盤事件屬性：onkeydown，onkeypress，onkeyup。
Mouse 事件就比較多了，比如常用的button按鈕的onclick，ondblclick。比如應用于p元素的onmousedown，可以讓文字內容便顏色。
如下是代碼：
<!DOCTYPE html>
<html>
<head>
<script>
function mouseDown()
{
document.getElementById("p1").style.color="red";
}
function mouseUp()
{
document.getElementById("p1").style.color="green";
}
</script>
</head>
<body>
<p id="p1" onmousedown="mouseDown()" onmouseup="mouseUp()">
請點擊文本！mouseDown() 函數當鼠標按鈕在段落上被按下時觸發。此函數把文本顏色設置為紅色。mouseUp() 函數在鼠標按鈕被釋放時觸發。mouseUp() 函數把文本的顏色設置為綠色。
</p>
</body>
</html>
說到這里，我突然想到了Vue代碼中的，@click="search"這樣的內容。最近還在接觸子組件向父組件傳值，也用到了@，然后就有點弄不清楚了。
但其實這里的內容和父子組件傳值無關了，這里就只是單純的點擊響應了。
重新復習下概念
v-bind指令用于設置HTML屬性：v-bind:href 縮寫為 :href
<a :href="{{url}}">aa</a>
v-on 指令用于綁定HTML事件 ：v-on:click 縮寫為 @click
<button @click="get()">aa</button>
其實 @click只是提供了一種模版語法，使冒泡、阻止默認行為更加方便，本質上還是和onClick用的一樣的事件監聽方式。兩者并沒有什么區別@click能做到的onClick也能做到。@click應該是vue對onClick的封裝。
如下方我這邊基于element-ui寫的代碼，
<el-button type="primary" @click="search">查詢</el-button>
這里的@click="search"其實是v-on:click="search"了。
回到HTML 標簽的屬性這里，<!--...--> 標簽不光自己本身并沒有自己特有的屬性，也不支持任何標準屬性和事件屬性。可謂是HTML所有標簽中最簡單的一個了吧。
這篇就寫到這里吧，主要介紹了<!--...--> 標簽相關的一些基礎知識，我們下一篇見！
*請認真填寫需求信息，我們會在24小時內與您取得聯系。
