欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

編寫(xiě)跨瀏覽器的javascript代碼必備[js多瀏覽器兼容寫(xiě)法]

 更新時(shí)間：2008年10月29日 22:47:41   作者：  
下面比較了幾種瀏覽器之間的差異，在寫(xiě)javascript代碼時(shí) 要時(shí)刻注意這些差異

序號(hào)

操作

分類

IE
(6.0)

FireFox
(2.0)

Mozilla
(1.5)

當(dāng)前
瀏覽器

備注

1

"."

訪問(wèn)tag的固有屬性

OK

OK

OK

OK

　

2

"."

訪問(wèn)tag的用戶定義屬性
eg: <input type="checkbox" myattr="test">

OK

NO

NO

OK

可以用getAttribute函數(shù) 替代

3

obj.getAttribute

訪問(wèn)tag的固有屬性

OK

OK

OK

OK

　

4

obj.getAttribute

訪問(wèn)tag的用戶定義屬性
eg: <input type="checkbox" myattr="test">

OK

OK

OK

OK

　

5

document.all

訪問(wèn)document的所有子元素
eg：document.all

OK

OK

NO

OK

建議用childNodes對(duì)象或者getElementById函數(shù)實(shí)現(xiàn)對(duì)應(yīng)操作。
有人說(shuō)它不能取Div元素，測(cè)試結(jié)果是可以，不知道是不是還有其它因素會(huì)影響測(cè)試結(jié)果。

6

obj.all

訪問(wèn)非document元素的所有子元素
eg: document.getElementById("mydiv").all

OK

NO

NO

OK

同上

7

getElementById()

根據(jù)元素的id/name來(lái)取得元素。
如果元素只設(shè)置name屬性,沒(méi)有設(shè)置id屬性。

OK

NO

NO

OK

注意：很多元素是沒(méi)有name屬性的,eg: td, div,span...

8

變量名 = ""

隱式定義變量-通過(guò)向變量名附值方式定義一個(gè)新的變量。

OK

OK

OK

OK

建議：為避免必要的麻煩，顯示定義變量。
eg：var tmp;

9

id

通過(guò)id直接調(diào)用對(duì)象
eg: test_result_1.innerHTML = ""

OK

OK

NO

OK

eval()函數(shù)用來(lái)執(zhí)行腳本，所以向eval函數(shù)里面?zhèn)魅雽?duì)象id/name的話，IE同樣會(huì)返回對(duì)象的引用。
建議用document.getElementById(id)方式調(diào)用
注意：因?yàn)檫@個(gè)原因，IE中隱式定義的變量不能和HTML中元素的id/name相同。

10

name

通過(guò)name直接調(diào)用對(duì)象
eg: test_for_this_name.innerHTML = ""

OK

NO

NO

OK

同上/ 原因同7

11

name

支持的特殊字符（"!",".","@","#","$","<",...）
eg: document.getElementsByName("aaaa!page");

NO

OK

OK

NO

其它的字符沒(méi)有測(cè)試

12

tr.innerHTML = ""

設(shè)置TR元素的內(nèi)部HTML腳本

NO

OK

OK

NO

在IE中，table、tr的innerHTML是只讀屬性，不能夠?qū)ζ渲苯釉O(shè)置。可以通過(guò)insertRow/insertCell函數(shù)進(jìn)行設(shè)置。

13

cells對(duì)象訪問(wèn)

訪問(wèn)tr的cells對(duì)象
前提：tr元素是被刪除后的tr對(duì)象，或者是用cloneNode(true)復(fù)制的刪除前的tr對(duì)象

NO

OK

OK

undefined

可以將其插入Table再訪問(wèn)，或者可以用getElementsByTagName函數(shù) 對(duì)td/th訪問(wèn)。
刪除后的rows對(duì)象不存在這個(gè)問(wèn)題。其它元素？

14

（index）

訪問(wèn)集合類對(duì)象
eg: document.
getElementsByTagName("TD")(0)

OK

NO

NO

OK

建議用正式的操作符"[]".

15

obj.toString()

取得對(duì)象的字符串"[object 對(duì)象類型的名稱]".
eg: td == "[object HTMLTableCellElement]"

NO

OK

OK

NO

可以省略toString()函數(shù)，直接用對(duì)象來(lái)操作。
注：在IE中返回"[object]"。

16

obj.class

定義對(duì)象的css式樣/風(fēng)格。
eg: td.class="XPstyle";

NO

OK

NO

-

無(wú)法寫(xiě)測(cè)試代碼，會(huì)有編譯錯(cuò)誤！可以自己用typeof(class) == null來(lái)測(cè)試一下，沒(méi)有異常就在代碼中可以使用。
在HTML腳本中用class，但是在Javascript中應(yīng)該用classname(class是JS的保留關(guān)鍵字).
注意：用 setAttribute可以把class值設(shè)置到對(duì)象中去，但是不會(huì)被當(dāng)作css式樣來(lái)解析。

17

const

保留關(guān)鍵字，用于定義常量。
eg：const HOURS = 24;

NO

OK

OK

-

暫時(shí)只能不使用const。

18

input.type

變更input元素的類型
eg: input.type="button";

NO

OK

OK

NO

IE可以初始input元素類型，但是不能變更類型。
如果必須變更，可以用更換input元素的方式。

19

obj.children

訪問(wèn)對(duì)象的子元素集合
eg: document.body.children.length;

OK

NO

NO

OK

可以用childNodes對(duì)象替代。

20

node.replaceNode

替換新的節(jié)點(diǎn)對(duì)象
eg: oldNode.replaceNode(newNode);

OK

NO

NO

OK

可以用replaceChild函數(shù)替換。

21

node.removeNode

刪除已有節(jié)點(diǎn)對(duì)象
eg.oldNode.removeNode(true);

OK

NO

NO

OK

可以用oldNode.parentNode.removeChild(oldNode)方式實(shí)現(xiàn)。

22

node.insertBefore

在指定節(jié)點(diǎn)對(duì)象前面插入一個(gè)節(jié)點(diǎn)對(duì)象
document.body.insertBefore(newN, oldN);

OK

OK

OK

OK

　

23

obj.parentElement

訪問(wèn)對(duì)象的父元素
eg: document.body.parentElement.id;

OK

NO

NO

OK

可以用parentNode對(duì)象替代。

24

obj.childNodes.length

返回子節(jié)點(diǎn)的數(shù)量，和tag的數(shù)量相同。
eg:document.body.childNodes.length;

OK

NO

NO

OK

FF/Mozilla中，空白或者換行是文本節(jié)點(diǎn)，是childNodes的成員。
可以用node.getElementsByTagName()回避。

25

obj.
insertAdjacentElement

向指定的位置插入元素
eg: obj.insertAdjacentElement("beforeBegin",button);

OK

NO

NO

OK

insertAdjacentElement函數(shù)和insertAdjacentText函數(shù)也類似。
可以用insertBefore函數(shù)實(shí)現(xiàn)類似功能。

26

createElement()

創(chuàng)建指定類型元素。
前提：元素為HTML腳本
eg：document.createElment("<input type='radio' value='test'>");

OK

NO

NO

OK

可以先創(chuàng)建出對(duì)象元素，再進(jìn)行屬性設(shè)置；或者直接以InnerHTML的形式加到對(duì)應(yīng)位置。
　

27

nodeName

取對(duì)象(tag,attribute,textnode)節(jié)點(diǎn)名稱
eg: name = obj.nodeName;

OK

OK

OK

OK

有人說(shuō)存在差異，不知道是具體的前提條件，先記錄備考。
替代方案：
如果節(jié)點(diǎn)是tag元素可以用"tagName"取值；如果節(jié)點(diǎn)是attribut對(duì)象可以用"name"取值;如果節(jié)點(diǎn)是textnode元素可以用nodeType==3判斷。

28

window.event

取得當(dāng)前的事件對(duì)象
eg: window.event;

OK

NO

NO

?

可以主動(dòng)向事件的響應(yīng)函數(shù)傳入event參數(shù)。
eg:<a onclick="javascript:showHelp(event)">help</a>

29

event.target

取得事件的觸發(fā)對(duì)象
eg: e.target;

NO

OK

OK

？

可以和srcElement共同使用;可以主動(dòng)向事件的響應(yīng)函數(shù)傳入觸發(fā)對(duì)象元素。
eg:<a onclick="javascript:showHelp(this, event)">help</a>

30

event.srcElement

取得事件的觸發(fā)對(duì)象
eg: e.srcElement;

OK

NO

NO

？

可以和target共同使用;可以主動(dòng)向事件的響應(yīng)函數(shù)傳入觸發(fā)對(duì)象。
eg: var obj = (e.target) ? e.target : e.srcElemtn;

31

event對(duì)象屬性

當(dāng)前三個(gè)瀏覽器的共同擁有的屬性：
altKey
button
cancelBubble
clientX
clientY
ctrlKey
screenX
screenY
shiftKey
type

　

altLeft
behaviorCookie
behaviorPart
bookmarks
boundElements
contentOverflow
ctrlLeft
dataFld
dataTransfer
fromElement
keyCode
nextPage
offsetX
offsetY
propertyName
qualifier
reason
recordset
repeat
returnValue
srcElement
shiftLeft
srcFilter
srcUrn
toElement
wheelDelta
x
y
　

bubbles
cancelable
currentTarget
detail
eventPhase
explicitOriginalTarget
isChar
isTrusted
layerX
layerY
metaKey
originalTarget
pageX
pageY
rangeOffset
rangeParent
relatedTarget
target
timeStamp
view
which

bubbles
cancelable
charCode
currentTarget
detail
eventPhase
explicitOriginalTarget
isChar
keyCode
layerX
layerY
metaKey
originalTarget
pageX
pageY
popupWindowURI
rangeOffset
rangeParent
relatedTarget
requestingWindowURI
target
timeStamp
view
which

?

event對(duì)象的不同點(diǎn)太多，在使用的時(shí)候需要一一檢查才行。具體可以用頁(yè)面下方的測(cè)試區(qū)域試驗(yàn)。

32

注冊(cè)event

用attachEvent函數(shù)注冊(cè)

OK

NO

NO

-

小心內(nèi)存泄漏?。?！
事件處理完后一定要調(diào)用detachEvent函數(shù)銷毀事件，而且要注意避免重復(fù)注冊(cè)。

33

注冊(cè)event

addEventListener函數(shù)注冊(cè)

NO

OK

OK

-

　

34

注冊(cè)event

obj.onxxx = Function("響應(yīng)函數(shù)名稱或代碼");方式注冊(cè)
eg: btn.onclick = Function(doclick);
btn.onclick = Function("return 1+1;");

OK

OK

OK

-

　

35

銷毀event

detachEvent函數(shù)銷毀

OK

NO

NO

-

　

36

銷毀event

removeEventListener函數(shù)銷毀

NO

OK

OK

-

　

37

銷毀event

obj.onxxx = null;方式注冊(cè)
eg: btn.onclick = null;

OK

OK

OK

-

　

38

觸發(fā)event

fireEvent函數(shù)
eg:btn.fireEvent("onclick");
FF:
var e = document.createEvent("Events");
e.initEvent("click", true, false);
element.dispatchEvent(event)

OK

NO

NO

-

　

39

觸發(fā)event

dispatchEvent函數(shù)
eg:
var evt = document.createEvent("MouseEvents");
evt.initMouseEvent("click", true, true);
btn.dispatchEvent(evt);

NO

OK

OK

-

　

相關(guān)文章

  • TypeScript入門(mén)-基本數(shù)據(jù)類型

    TypeScript入門(mén)-基本數(shù)據(jù)類型

    本文主要介紹了TypeScript基本數(shù)據(jù)類型的相關(guān)知識(shí)。具有很好的參考價(jià)值，下面跟著小編一起來(lái)看下吧
    2017-03-03
  • js版本A*尋路算法

    js版本A*尋路算法

    js版本A*尋路算法...
    2006-12-12
  • 運(yùn)用js教你輕松制作html音樂(lè)播放器

    運(yùn)用js教你輕松制作html音樂(lè)播放器

    這篇文章主要為大家詳細(xì)介紹了如何運(yùn)用js教你輕松制作html音樂(lè)播放器，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
    2016-09-09
  • js限制輸入框只能輸入數(shù)字(onkeyup觸發(fā))

    js限制輸入框只能輸入數(shù)字(onkeyup觸發(fā))

    這篇文章主要介紹了通過(guò)js實(shí)現(xiàn)input輸入框只能輸入數(shù)字的實(shí)現(xiàn)方法，主要是通過(guò)正則表達(dá)式替換實(shí)現(xiàn),需要的朋友可以參考下
    2018-09-09
  • JavaScript設(shè)計(jì)模式之性能優(yōu)化模式享元模式

    JavaScript設(shè)計(jì)模式之性能優(yōu)化模式享元模式

    這篇文章主要介紹了JavaScript設(shè)計(jì)模式之性能優(yōu)化模式享元模式，享元設(shè)計(jì)模式是用于性能優(yōu)化的模式，這種設(shè)計(jì)模式的核心在于可以共享技術(shù)并支持對(duì)大量細(xì)分過(guò)后的對(duì)象進(jìn)行調(diào)整，更多相關(guān)內(nèi)容需要的小伙伴可以參考一下
    2022-06-06
  • H5實(shí)現(xiàn)手機(jī)拍照和選擇上傳功能

    H5實(shí)現(xiàn)手機(jī)拍照和選擇上傳功能

    這篇文章主要為大家詳細(xì)介紹了H5實(shí)現(xiàn)手機(jī)拍照和選擇上傳功能，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
    2019-12-12
  • 人人網(wǎng)javascript面試題 可以提前實(shí)現(xiàn)下

    人人網(wǎng)javascript面試題 可以提前實(shí)現(xiàn)下

    JavaScript面試題要求：以下題目必須從一至四題中，選出三道題，使用原生代碼實(shí)現(xiàn)，不可使用任何框架，第五題為選作題
    2012-01-01
  • 中高級(jí)前端必須了解的JS中的內(nèi)存管理(推薦)

    中高級(jí)前端必須了解的JS中的內(nèi)存管理(推薦)

    這篇文章主要介紹了中高級(jí)前端必須了解的JS中的內(nèi)存管理，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧
    2019-07-07
  • uniapp中常用的事件處理方法詳解

    uniapp中常用的事件處理方法詳解

    在UniApp中事件處理非常重要,通過(guò)事件處理可以實(shí)現(xiàn)用戶與應(yīng)用程序之間的交互,這篇文章主要給大家介紹了關(guān)于uniapp中常用的事件處理方法的相關(guān)資料,需要的朋友可以參考下
    2023-12-12
  • JavaScript三種方法解決約瑟夫環(huán)問(wèn)題的方法

    JavaScript三種方法解決約瑟夫環(huán)問(wèn)題的方法

    約瑟夫環(huán)問(wèn)題又稱約瑟夫問(wèn)題或丟手絹問(wèn)題，是一道經(jīng)典的算法問(wèn)題，本篇將以循環(huán)鏈表、有序數(shù)組、數(shù)學(xué)遞歸三種方式來(lái)解決約瑟夫環(huán)問(wèn)題。感興趣的可以了解一下
    2021-09-09

最新評(píng)論