Warning: error_log(/data/www/wwwroot/hmttv.cn/caches/error_log.php): failed to open stream: Permission denied in /data/www/wwwroot/hmttv.cn/phpcms/libs/functions/global.func.php on line 537 Warning: error_log(/data/www/wwwroot/hmttv.cn/caches/error_log.php): failed to open stream: Permission denied in /data/www/wwwroot/hmttv.cn/phpcms/libs/functions/global.func.php on line 537
TML5 引入了新的 HTML 元素和屬性,有的是傳統通用元素的語義化版本,如取代 div 元素的 nav, footer 等元素,也有一些全新的元素,如 audio, video。一些在 HTML4 中不被推薦使用的元素,如 font 和 center 將被棄用。HTML5 引入的新 HTML 元素包括:
article:文章
aside:內容旁邊的側邊欄內容
audio:音頻
canvas:2D 繪圖
command:命令按鈕
datalist:下拉選擇框
details:對象的細節
dialog:對話框
embed:外部插件或對象
figure:一組媒體對象以及標簽文字
footer:頁腳
header:頁首
hgroup:文檔某一部分的信息
keygen:表單生成的 Key
mark:標注的文字
meter:預先定義的范圍內的度量
nav:導航條
output:輸出
progress:進度條
rp:標識 rubby 內容
rt:rubby 內容的解釋
ruby:rubby 內容
section:定義一個部分
source:媒體的資源
time:日期時間
video:視頻
這些新標簽,可以讓你的 HTML 文檔更容易加載,且更容易被搜索引擎抓取其中的有用信息。比如,搜索引擎可以直接抓取它最關心的 article 標簽里面的內容。
得上學時,老師千叮嚀、萬囑咐的告訴我們“好記性不如爛筆頭”這句至理名言,筆記一定要記,還要記好,自從來到html5的世界之后,發現更是如此,許多細節需要寫一些注釋,不然過幾天就忘。俗話說:“最淡的墨水,也勝過最強的記憶。”今天把Html5中的事件屬性整理了一下,與大家分享。
全局事件屬性
HTML 4 增加了使事件在瀏覽器中觸發動作的能力,比如當用戶點擊元素時啟動 JavaScript,下面列出了添加到 HTML 元素以定義事件動作的全局事件屬性。
Window事件屬性
針對 window 對象觸發的事件(應用到 <body> 標簽),他們的值都是script
onafterprint 文檔打印之后運行的腳本。
onbeforeprint文檔打印之前運行的腳本。
onbeforeunload文檔卸載之前運行的腳本。
onerror在錯誤發生時運行的腳本。
onhaschange當文檔已改變時運行的腳本。
onload頁面結束加載之后觸發。
onmessage在消息被觸發時運行的腳本。
onoffline當文檔離線時運行的腳本。
Ononline當文檔上線時運行的腳本。
onpagehide當窗口隱藏時運行的腳本。
onpageshow當窗口成為可見時運行的腳本。
onpopstate當窗口歷史記錄改變時運行的腳本。
onredo當文檔執行撤銷(redo)時運行的腳本。
onresize當瀏覽器窗口被調整大小時觸發。
onstorage 在 Web Storage 區域更新后運行的腳本。
onundo 在文檔執行 undo 時運行的腳本。
onunload一旦頁面已下載時觸發(或者瀏覽器窗口已被關閉)。
Form事件
由 HTML 表單內的動作觸發的事件(應用到幾乎所有 HTML 元素,但最常用在 form 元素中,同樣的,以下屬性的值都是script。
onblur元素失去焦點時運行的腳本。
onchange 在元素值被改變時運行的腳本。
oncontextmenu 當上下文菜單被觸發時運行的腳本。
onfocus當元素獲得焦點時運行的腳本。
onformchange 在表單改變時運行的腳本。
onforminput當表單獲得用戶輸入時運行的腳本。
oninput當元素獲得用戶輸入時運行的腳本。
oninvalid 當元素無效時運行的腳本。
onreset當表單中的重置按鈕被點擊時觸發。HTML5 中不支持。
onselect在元素中文本被選中后觸發。
onsubmit在提交表單時觸發。
Mouse事件
由鼠標或類似用戶動作觸發的事件:
onclick元素上發生鼠標點擊時觸發。
ondblclick元素上發生鼠標雙擊時觸發。
ondrag 元素被拖動時運行的腳本。
ondragend 在拖動操作末端運行的腳本。
ondragenter當元素元素已被拖動到有效拖放區域時運行的腳本。
ondragleave當元素離開有效拖放目標時運行的腳本。
ondragover當元素在有效拖放目標上正在被拖動時運行的腳本。
ondragstart在拖動操作開端運行的腳本。
ondrop當被拖元素正在被拖放時運行的腳本。
onmousedown當元素上按下鼠標按鈕時觸發。
onmousemove 當鼠標指針移動到元素上時觸發。
onmouseout當鼠標指針移出元素時觸發。
onmouseover當鼠標指針移動到元素上時觸發。
onmouseup 當在元素上釋放鼠標按鈕時觸發。
onmousewheel 當鼠標滾輪正在被滾動時運行的腳本。
onscroll 當元素滾動條被滾動時運行的腳本。
Media事件
由媒介(比如視頻、圖像和音頻)觸發的事件(適用于所有 HTML 元素,但常見于媒介元素中,比如 <audio>、<embed>、<img>、<object> 以及 <video>):
onabort在退出時運行的腳本。
oncanplay當文件就緒可以開始播放時運行的腳本(緩沖已足夠開始時)。
oncanplaythrough當媒介能夠無需因緩沖而停止即可播放至結尾時運行的腳本。
ondurationchange當媒介長度改變時運行的腳本。
onemptied當發生故障并且文件突然不可用時運行的腳本(比如連接意外斷開時)。
onended 當媒介已到達結尾時運行的腳本(可發送類似“感謝觀看”之類的消息)。
onerror當在文件加載期間發生錯誤時運行的腳本。
onloadeddata當媒介數據已加載時運行的腳本。
onloadedmetadata當元數據(比如分辨率和時長)被加載時運行的腳本。
onloadstart在文件開始加載且未實際加載任何數據前運行的腳本。
onpause當媒介被用戶或程序暫停時運行的腳本。
onplay當媒介已就緒可以開始播放時運行的腳本。
onplaying當媒介已開始播放時運行的腳本。
onprogress當瀏覽器正在獲取媒介數據時運行的腳本。
onratechange每當回放速率改變時運行的腳本(比如當用戶切換到慢動作或快進模式)。
onreadystatechange每當就緒狀態改變時運行的腳本(就緒狀態監測媒介數據的狀態)。
onseeked當 seeking 屬性設置為 false(指示定位已結束)時運行的腳本。
onseeking當 seeking 屬性設置為 true(指示定位是活動的)時運行的腳本。
onstalled在瀏覽器不論何種原因未能取回媒介數據時運行的腳本。
onsuspend在媒介數據完全加載之前不論何種原因終止取回媒介數據時運行的腳本。
ontimeupdate當播放位置改變時(比如當用戶快進到媒介中一個不同的位置時)運行的腳本。
onvolumechange每當音量改變時(包括將音量設置為靜音)時運行的腳本。
onwaitin當媒介已停止播放但打算繼續播放時(比如當媒介暫停已緩沖更多數據)運行腳本
以上這些屬性你掌握了多少,又忘記了多少呢,趕緊撿起來哦。
給大家整理一下H5的全局屬性。
1、當標簽設置屬性——contentEditable時,該元素就可以被修改,目前并沒有相應的API支持保存之后修改后的文字
2、除了contentEditable之外,元素還具有一個isContentEditable屬性,當屬性可編輯時,該屬性值為true,當元素不可編輯時,該屬性為false;
3、designMode屬性用來指定整個頁面是否可編輯,當頁面可編輯時,頁面中任何支持contentEditable屬性的元素值都編程了可編輯狀態。designMode屬性只能在JavaScript腳本中被編輯修改,該屬性的值有兩個——“off”與“off”。
document.designMode="on"
IE8出于安全考慮并不支持;IE9允許進入可編輯狀態;Chrome3和Safari使用內嵌frame方式,該內嵌frame是可編輯的;FireFox和 Opera允許使用designMode屬性讓頁面進入可編輯狀態。
4、hidden,所有的元素都允許使用hidden屬性,該屬性類似于input中的hidden屬性,hidden有兩個值,“true”與“false”,“true”時為 可見,“false”時為隱藏。
5、spellcheck,它是針對input以及textarea元素提供的新屬性,該屬性是一個boolean值,“true”與“false”,“true”時,開啟拼寫檢查,“false”時關閉拼寫檢查。
P.S.:如果元素的readOnly屬性或者disabled屬性設置 為true時,則不執行拼寫檢查,目前除了 IE之外的瀏覽器都對該屬性進行了支持。
6、tabindex,是開發中的一個基本概念,我聯想到了winform中的tabindex,當不斷的敲擊tab鍵讓窗口或者文本框獲得焦點,在過去的編輯網頁中是非常有用的,但是如今控件的遍歷順序都是由元素在頁面上所處的位置決定的,但是tabindex還有另外一個作用,在默認情況下,只有鏈接元素與表單元素可以通過按鍵獲取焦點,如果對其他元素使用 tabindex屬性后,也能讓該元素獲得焦點,那么當腳本中中執行focus()語句的時候,就可以讓該元素獲得焦點。但是 這樣會差生一個副作用:該元素也可以通過按tab鍵獲得焦點,把元素值設為負數(通常為-1)后就 可以解決這個問題了,設為負數后可以通過編程的方式讓元素獲得焦點,但按下tab鍵時該元素就不能獲得焦點。
*請認真填寫需求信息,我們會在24小時內與您取得聯系。