HTML5學習筆記簡明版（8）：新增的全域屬性，html5學習筆記

HTML5學習筆記簡明版（8）：新增的全域屬性，html5學習筆記
contenteditable屬性

任何元素使用contenteditable屬性的話，代表該元素是一個可編輯的地區。使用者可以改變元素的內容以及操作標記。例如：

<p contenteditable="true">這是一段可編輯的段落。請試著編輯該文本。</p>

 

該屬於有3種值可選：true, false和Null 字元，Null 字元代表true。

而對<iframe id="editor"></iframe>架構頁面可以通過JS程式碼來實現：editor.document.designMode="on" 。

 

contextmenu屬性

contextmenu屬性用來指向一個作者提供的上下文目錄，例如：

<form name="npc" action=""> <label>Character name: <input type=text contextmenu=namemenu  required></label> <menu type=context id=namemenu>  <command label="Pick random name" onclick="document.forms.npc.elements.char.value = getRandomName()">  <command label="Prefill other fields based on name" onclick="prefillFields(document.forms.npc.elements.char.value)"> </menu></form>

 

data-*屬性

開發人員可以在任何元素上定義他們想要的任何屬性，只要他們在其之前加上 data- 的首碼，以此避免與未來的HTML版本的衝突，asp.net MVC下的jQuery驗證就是採用這種方式，例如：data-val=”true”。

 draggable和dropzone屬性

draggable 和 dropzone 屬性可以與新的拖放API一起使用，draggable為是否允許拖放，dropzone代表可以拖放到哪個地區。

<p draggable="true" dropzone="div1">test</p>

 hidden屬性

不顯示定義了hidden屬性的元素。但與表現層的比如tab切換隱藏圖層不同，hidden後的元素針對所有的顯示，比如螢幕助讀程式。與form裡的hidden域相似。

 role和aria-*屬性

HTML5把WAI-ARIA當作是合法的語言增加，用來做輔助作用。

 spellcheck屬性

spellcheck 屬性規定是否對元素內容進行拼字檢查。例如：

<p contenteditable="true" spellcheck="true">這是可編輯的段落。請試著編輯文本。</p>

著作權聲明：本文為博主http://www.zuiniusn.com原創文章，未經博主允許不得轉載。