目錄
 1、readyState屬性" > 1、readyState屬性
  JavaScript程式碼" >  JavaScript程式碼
  作為對document.body,所以引用文檔的body元素的,就可以引用了這樣元素的標籤。使用方法如下" >  作為對document.body,所以引用文檔的body元素的,就可以引用了這樣元素的標籤。使用方法如下
【相關推薦】
首頁 web前端 H5教程 HTML5實戰與剖析之HTMLDocument變化

HTML5實戰與剖析之HTMLDocument變化

May 25, 2017 pm 03:21 PM

  之前為大家介紹了些許關於HTML5新添加的小東東,想必大家也有所了解了。今天要為大家介紹HTML5中有關HTMLDocument方面新加入的內容。那麼HTML5中有關HTMLDocument方面新加入的內容都有什麼呢?HTML5中有關HTMLDocument方面新加入的內容有readyState屬性、相容模式判斷和head屬性。下面就為大家一一介紹這些新加入的小東東吧。

 1、readyState屬性

  早在IE4時代的時候,document物件就引入了readyState屬性了,但是一直都沒有納入標準,如今,在HTML5的時代了,就納入規範了。 readyState屬性有兩個可能的值:

  (1)loadding,正在加載文檔

  (2)complete,已經加載完文檔

  如何才能恰當的使用document.read完文檔

  如何才能恰當的使用document.ready4dument.ready?就是透過它來實現一個指示文檔已經載入完成的指示器。在這個屬性得到廣泛支援之前,要實作這樣一個指示器,還是必須需要onload事件處理程序設定一個標籤,表示文件已經載入完畢。下例子如下

  HTML程式碼

<p>梦龙小站</p>
<p class="complete"></p>
登入後複製

  JavaScript程式碼

<script type="text/javascript">
window.onload = function(){
	var a = 0;
	var b = 0;
	if(document.readyState == "complete"){
		$(".complete").html( "加载好了" )
	}

	if(document.readyState == "loading"){
		$(".load").html( $(".load").html() + "<br/>" + a++ )
	}
};
登入後複製

  < HTML5實戰與剖析之HTMLDocument變化
  IE6之後就開始區分渲染頁的模式了,分為標準的和混雜的,偵測頁面的相容模式就成為瀏覽器的必要功能。 IE為此為document增加了一個名為compatMode的屬性,這個屬性就是為了告訴開發人員瀏覽器用了哪一種渲染模式。就像下面的小例子中所展示的那樣,在標準模式下,document.compatMode的值等於”CSS1Compat”,而在混雜模式下,document.compatMode的值等於”BackCompat”。

  JavaScript程式碼

if(document.compatMode == "CSS1Compat"){
	alert("标准模式")
}else{
	alert("混杂兼容模式")
}
登入後複製

  3、Head屬性

  作為對document.body,所以引用文檔的body元素的,就可以引用了這樣元素的標籤。使用方法如下

  JavaScript程式碼
var head = document.head || document.getElementsByTagName("head")[0];
登入後複製
  就像上面那樣做一下相容,如果可以用的話,就是用document.head,否則仍然使用getElementsByTagName()方法。 document.head屬性支援的瀏覽器有Chrome和safari 5。

  HTML5實戰與剖析之HTMLDocument變化(readyState屬性、兼容模式和head屬性)就為大家介紹到這裡,在百忙當中學習一下新的小知識,生活還是很充實的,並把學習的一些小東東和大家分享一下,那簡直的神仙般的日子了。 HTML5實戰與剖析的相關更新。

【相關推薦】

1. 

免費h5線上影片教學

2. 

HTML5 完整版手冊

cn實錄-資源載入模組程式碼詳解

本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

AI Hentai Generator

AI Hentai Generator

免費產生 AI 無盡。

熱門文章

R.E.P.O.能量晶體解釋及其做什麼(黃色晶體)
1 個月前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.最佳圖形設置
1 個月前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.如果您聽不到任何人,如何修復音頻
1 個月前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.聊天命令以及如何使用它們
1 個月前 By 尊渡假赌尊渡假赌尊渡假赌

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

HTML 中的表格邊框 HTML 中的表格邊框 Sep 04, 2024 pm 04:49 PM

HTML 表格邊框指南。在這裡,我們以 HTML 中的表格邊框為例,討論定義表格邊框的多種方法。

HTML 左邊距 HTML 左邊距 Sep 04, 2024 pm 04:48 PM

HTML 左邊距指南。在這裡,我們討論 HTML margin-left 的簡要概述及其範例及其程式碼實作。

HTML 中的巢狀表 HTML 中的巢狀表 Sep 04, 2024 pm 04:49 PM

這是 HTML 中巢狀表的指南。這裡我們討論如何在表中建立表格以及對應的範例。

HTML 表格佈局 HTML 表格佈局 Sep 04, 2024 pm 04:54 PM

HTML 表格佈局指南。在這裡,我們詳細討論 HTML 表格佈局的值以及範例和輸出。

HTML 輸入佔位符 HTML 輸入佔位符 Sep 04, 2024 pm 04:54 PM

HTML 輸入佔位符指南。在這裡,我們討論 HTML 輸入佔位符的範例以及程式碼和輸出。

HTML 有序列表 HTML 有序列表 Sep 04, 2024 pm 04:43 PM

HTML 有序列表指南。在這裡我們也分別討論了 HTML 有序列表和類型的介紹以及它們的範例

在 HTML 中移動文字 在 HTML 中移動文字 Sep 04, 2024 pm 04:45 PM

HTML 中的文字移動指南。在這裡我們討論一下marquee標籤如何使用語法和實作範例。

HTML onclick 按鈕 HTML onclick 按鈕 Sep 04, 2024 pm 04:49 PM

HTML onclick 按鈕指南。這裡我們分別討論它們的介紹、工作原理、範例以及各個事件中的onclick事件。

See all articles