柚子快報激活碼778899分享：前端 HTML5-新增全局元素

http://yzkb.51969.com/

HTML5中升級后的a元素

HTML5為a元素新增了3個屬性

屬性說明download定義可被下載的目標（如文件，圖片等）media定義被鏈接文檔為何媒介/設(shè)備優(yōu)化的type定義被鏈接文檔的MIME類型

語法:

注意：download屬性用于為文件取一個新的文件名。如果download屬性值省略，則表示使用舊的文件名

實例:

下載圖片

下載圖片

運行結(jié)果

全局元素相關(guān)

新增全局元素（任何元素都可以使用）

屬性說明contenteditable規(guī)定是否可編輯元素的內(nèi)容hidden規(guī)定元素是否被隱藏draggable元素是否可以被拖動spellcheck對用戶輸入的文本內(nèi)容進行拼寫和語法檢查date-*為元素實現(xiàn)自定義屬性

contenteditable屬性、

概念：contenteditable屬性規(guī)定是否可編輯元素的內(nèi)容，前提是該元素必須可以獲得光標焦點并且其內(nèi)容不是只讀的。

語法：

屬性值：

true：元素內(nèi)容可以被編輯 false：默認值，元素內(nèi)不能被編輯

實例：

這是一段可以被編輯的文字

運行結(jié)果：

hidden屬性

概念：hidden元素規(guī)定元素是否被隱藏。

語法：

屬性值

hidden：元素會被隱藏。 默認值：元素會被顯示

注意：使用hidden屬性僅僅是隱藏了元素的顯示，但元素仍然存在于HTML文檔中占據(jù)空間，可以通過JavaScript等技術(shù)訪問它們。CSS中的display:none是完全消失不占據(jù)空間，屬性和樣式不存在

實例

1. 數(shù)學

運行結(jié)果

draggable屬性

概念:draggable屬性來定義某一個元素是否可以被拖動

語法:

屬性值

true：表示元素可以被拖動 false：默認值，表示元素不可以被拖動

實例:

這是一段不可以被拖動的文字

這是一段可以被拖動的文字

運行結(jié)果

spellcheck屬性

概念：spellcheck屬性主要用于 input 元素和 textarea元素，對用戶輸入的文本內(nèi)容進行拼寫和語法檢查。

屬性值：

true：檢測輸入框中的值 false：不檢查輸入框中的值（默認值）

date-*屬性

概念:可以使用data-*屬性來為元素實現(xiàn)自定義屬性

語法:

"data-"是一個前綴，后面接一個小寫的字符串，例如data-color,date-article-title等

data-*屬性用于存儲頁面或應用程序的私有自定義數(shù)據(jù)

data-*屬性賦予我們在所有HTML元素上嵌入自定義data屬性的能力

存儲的（自定義）數(shù)據(jù)能夠被頁面的 JavaScript 中利用，以創(chuàng)建更好的用戶體驗（不進行 Ajax 調(diào)用或服務(wù)器端數(shù)據(jù)庫查詢）

實例

科目

點擊某個科目來查看其類別：

?

• 數(shù)學

?

• 化學
?

?

• 歷史
?

?

運行結(jié)果

柚子快報激活碼778899分享：前端 HTML5-新增全局元素

http://yzkb.51969.com/

推薦閱讀