萬盛學電腦網

 萬盛學電腦網 >> 網頁制作 >> 交互設計 >> 從零開始學習jQuery (九) jQuery工具函數

從零開始學習jQuery (九) jQuery工具函數

一.摘要

返回值: Object

說明:

jQuery 1.3 新增。一組用於展示不同浏覽器各自特性和bug的屬性集合。

jQuery提供了一系列屬性,你也可以自由增加你自己的屬性。其中許多屬性是很低級的,所以很難說他們能否在日新月異的發展中一直保持有效,但這這些主要用於插件和內核開發者。

所有這些支持的屬性值都通過特性檢測來實現,而不是用任何浏覽器檢測。以下有一些非常棒的資源用於解釋這些特性檢測是如何工作的:

  • http://peter.michaux.ca/articles/feature-detection-state-of-the-art-browser-scripting
  • http://yura.thinkweb2.com/cft/
  • http://www.jibbering.com/faq/faq_notes/not_browser_detect.html

jQuery.support主要包括以下測試:

boxModel: 如果這個頁面和浏覽器是以W3C CSS盒式模型來渲染的,則等於true。通常在IE 6和IE 7的怪癖模式中這個值是false。在document准備就緒前,這個值是null。

cssFloat: 如果用cssFloat來訪問CSS的float的值,則返回true。目前在IE中會返回false,他用styleFloat代替。

hrefNormalized: 如果浏覽器從getAttribute("href")返回的是原封不動的結果,則返回true。在IE中會返回false,因為他的URLs已經常規化了。

htmlSerialize: 如果浏覽器通過innerHTML插入鏈接元素的時候會序列化這些鏈接,則返回true,目前IE中返回false。

leadingWhitespace: 如果在使用innerHTML的時候浏覽器會保持前導空白字符,則返回true,目前在IE 6-8中返回false。

noCloneEvent: 如果浏覽器在克隆元素的時候不會連同事件處理函數一起復制,則返回true,目前在IE中返回false。

objectAll: 如果在某個元素對象上執行getElementsByTagName("*")會返回所有子孫元素,則為true,目前在IE 7中為false。

opacity: 如果浏覽器能適當解釋透明度樣式屬性,則返回true,目前在IE中返回false,因為他用alpha濾鏡代替。

scriptEval: 使用 appendChild/createTextNode 方法插入腳本代碼時,浏覽器是否執行腳本,目前在IE中返回false,IE使用 .text 方法插入腳本代碼以執行。

style: 如果getAttribute("style")返回元素的行內樣式,則為true。目前IE中為false,因為他用cssText代替。

tbody: 如果浏覽器允許table元素不包含tbody元素,則返回true。目前在IE中會返回false,他會自動插入缺失的tbody。

講解:

針對上面眾多的浏覽器特性屬性,  本文只講解兩個特性.

1.盒式模型 boxModel

下圖是W3C標准中的盒式模型圖:

image

假設如下元素:

Code
<style type="text/css">
.boxModel
{
width:200px;
height:50px;
padding:10px;
border:solid 5px #FF0000;
background-color:#acacac;
}
</style>
<div id="divBox" class="boxModel">