JsDom 編程小結(jié)
更新時間:2011年08月09日 21:24:39 作者:
JsDom編程小結(jié),需要進行dom操作的朋友可以參考下。
1.瀏覽器兼容問題:
瀏覽器兼容性的例子:ie6,ie7對table.appendChild("tr")的支持和IE8不一樣,用insertRow、insertCell來代替或者為表格添加tbody,然后向tbody中添加tr。FF(FireFox)不支持InnerText,用textContent代替
2.幾乎所有DOM元素都有innerText、innerHTML屬性(注意大小寫),分別是元素標簽內(nèi)內(nèi)容的文本表示形式和HTML源代碼,這兩個屬性是可讀可寫的。
動態(tài)創(chuàng)建元素的時候innerHTML可以代替createElement(),屬于簡單,粗放型,后果自負的創(chuàng)建
3.write():
document.write()只能在頁面加載過程中才能動態(tài)創(chuàng)建
4.
document是window對象的一個屬性,因為使用window對象成員的時候可以省略window.,所以一般直接寫document
5.history操作歷史記錄
window.history.back()后退;window.history.forward()前進。也可以用window.history.go(-1)、window.history.go(1)前進
6.clipboardData對象,對粘貼板的操作:
clearData("Text")清空粘貼板;getData("Text")讀取粘貼板的值,返回值為粘貼板中的內(nèi)容;setData("Text",val),設(shè)置粘貼板中的值。
7.oncopy="setTimeout('modifyClipboard()',100)"。用戶復(fù)制動作發(fā)生0.1秒以后再去改粘貼板中的內(nèi)容。100ms只是一個經(jīng)常取值,寫1000、10、50、200……都行。不能直接在oncopy里修改粘貼板。不能直接在oncopy中執(zhí)行對粘貼板的操作,因此設(shè)定定時器,0.1秒以后執(zhí)行,這樣就不再oncopy的執(zhí)行調(diào)用棧上了
8.returnValue屬性:
returnValue屬性,如果將returnValue設(shè)置為false,就會取消默認事件的處理。在超鏈接的onclick里面禁止訪問href的頁面。在表單校驗的時候禁止提交表單到服務(wù)器,防止錯誤數(shù)據(jù)提交給服務(wù)器、防止頁面刷新。
//window.event.returnValue不兼容火狐瀏覽器
9.
window.event對象的成員:
srcElement,獲得事件源對象。幾個事件共享一個事件響應(yīng)函數(shù)用。****_click(object sender,EventArgs e)//只有IE支持。
button,發(fā)生事件時鼠標按鍵,1為左鍵,2為右鍵,3為左右鍵同時按。//要測試event.button的值的時候,請在onmousedown事件中測試。如果在onclick事件中只能識別鼠標左鍵的單擊。
10.
window.location.href=‘';//重新導(dǎo)航到新頁面,可以取值,也可以賦值。
window.location.reload();//刷新當(dāng)前頁
location.search:獲得url(?號以后的,包含?)
11.
(1)onload:網(wǎng)頁加載完畢時觸發(fā),瀏覽器是一邊下載文檔、一邊解析執(zhí)行,可能會出現(xiàn)JavaScript執(zhí)行時需要操作某個元素,這個元素還沒有加載,如果這樣就要把操作的代碼放到body的onload事件中,或者可以把JavaScript放到元素之后。元素的onload事件是元素自己加載完畢時觸發(fā),body onload才是全部加載完成
(2)onunload:網(wǎng)頁關(guān)閉(或者離開)后觸發(fā)。
(3)onbeforeunload:在網(wǎng)頁準備關(guān)閉(或者離開)前觸發(fā)。
<body onbeforeunload=“return ‘真的要放棄發(fā)帖退出嗎?'; ">。顯示的文字隨瀏覽器版本而有差異。
12.
js中調(diào)用方法的時候就是把指針賦給它
var t=add;
function add(){}
13.
window.event.clientX是客戶端可視界面
14.
一、setInterval(code,time)方法可以每隔 time毫秒執(zhí)行一次code.
其中的code有兩種方式:
1.直接傳入 某個方法 對象 - setInterval(showTime,1000);
2.直接傳入要執(zhí)行 的 js代碼字符串 - setInterval("alert(1);",1000);
二、關(guān)于 for in (用來循環(huán) 對象的屬性和值)
使用 for in 來循環(huán)數(shù)組時,會將 數(shù)組的屬性先循環(huán)出來
然后再 循環(huán) 數(shù)組里的元素 ,但此時 循環(huán)出來的 k 是元素的下標
三、innerHTML
將 字符串 添加到 對應(yīng)的 雙標簽 中間。
并且立刻對 該字符串進行解析,如果符合html標簽的語法,
則,立即調(diào)用 瀏覽器的解析器,對該字符串進行html解析,并
生成對應(yīng)的 dom 對象,最后,將該dom對象,追加到被添加的
對象的 子元素 集合(ChildNodes)中。
15.
ShowModalDialog函數(shù)的功能:
打開一個子窗口,并且可與父窗口相互傳遞數(shù)據(jù),它與window.open的最大區(qū)別
就在于由ShowModalDialog打開子窗口后,父窗口將不能操作。
使用方法:
vReturnValue = window.showModalDialog(sURL [, vArguments] [,
sFeatures])
參數(shù)說明:
sURL
必選參數(shù),類型:字符串。用來指定對話框要顯示的文檔的URL。
vArguments
可選參數(shù),類型:變體。用來向?qū)υ捒騻鬟f參數(shù)。傳遞的參數(shù)類型不限,包括數(shù)
組等。對話框通過window.dialogArguments來取得傳遞進來的參數(shù)。
sFeatures
可選參數(shù),類型:字符串。用來描述對話框的外觀等信息,可以使用以下的一個
或幾個,用分號“;”隔開。
dialogHeight 對話框高度,不小于100px,IE4中dialogHeight
和 dialogWidth 默認的單位是em,而IE5中是px,為方便其見,在定義modal
方式的對話框時,用px做單位。
dialogWidth: 對話框?qū)挾取?
dialogLeft: 距離桌面左的距離。
dialogTop: 離桌面上的距離。
center: {yes | no | 1 | 0 }:窗口是否居中,默認yes,但仍可以指定
高度和寬度。
help: {yes | no | 1 | 0 }:是否顯示幫助按鈕,默認yes。
resizable: {yes | no | 1 | 0 } [IE5+]:是否可被改變大小。默
認no。
status: {yes | no | 1 | 0 } [IE5+]:是否顯示狀態(tài)欄。默認為yes[
Modeless]或no [Modal]。
scroll:{ yes | no | 1 | 0 | on | off }:指明對話框是否顯示滾動
條。默認為yes。
參數(shù)傳遞方法:
父窗口向子窗口傳遞參數(shù)采用ShowModalDialog的第2個參數(shù)即可,父窗口要獲取
子窗口傳回的參數(shù)則可通過ShowModalDialog函數(shù)的返回值獲取。
子窗口獲取父窗口參數(shù)的方法為采用子窗口window對象dialogArguments屬性獲
取,例如:
parent.html
<script>
var obj = new Object();
obj.name="51js";
window.showModalDialog
("modal.html",obj,"dialogWidth=200px;dialogHeight=100px");
</script>
modal.html
<script>
var obj = window.dialogArguments
alert("您傳遞的參數(shù)為:" + obj.name)
</script>
子窗口向父窗口返回參數(shù)采用window.returnValue屬性,如:
window.returnValue=1;
window.close();
瀏覽器兼容性的例子:ie6,ie7對table.appendChild("tr")的支持和IE8不一樣,用insertRow、insertCell來代替或者為表格添加tbody,然后向tbody中添加tr。FF(FireFox)不支持InnerText,用textContent代替
2.幾乎所有DOM元素都有innerText、innerHTML屬性(注意大小寫),分別是元素標簽內(nèi)內(nèi)容的文本表示形式和HTML源代碼,這兩個屬性是可讀可寫的。
動態(tài)創(chuàng)建元素的時候innerHTML可以代替createElement(),屬于簡單,粗放型,后果自負的創(chuàng)建
3.write():
document.write()只能在頁面加載過程中才能動態(tài)創(chuàng)建
4.
document是window對象的一個屬性,因為使用window對象成員的時候可以省略window.,所以一般直接寫document
5.history操作歷史記錄
window.history.back()后退;window.history.forward()前進。也可以用window.history.go(-1)、window.history.go(1)前進
6.clipboardData對象,對粘貼板的操作:
clearData("Text")清空粘貼板;getData("Text")讀取粘貼板的值,返回值為粘貼板中的內(nèi)容;setData("Text",val),設(shè)置粘貼板中的值。
7.oncopy="setTimeout('modifyClipboard()',100)"。用戶復(fù)制動作發(fā)生0.1秒以后再去改粘貼板中的內(nèi)容。100ms只是一個經(jīng)常取值,寫1000、10、50、200……都行。不能直接在oncopy里修改粘貼板。不能直接在oncopy中執(zhí)行對粘貼板的操作,因此設(shè)定定時器,0.1秒以后執(zhí)行,這樣就不再oncopy的執(zhí)行調(diào)用棧上了
8.returnValue屬性:
returnValue屬性,如果將returnValue設(shè)置為false,就會取消默認事件的處理。在超鏈接的onclick里面禁止訪問href的頁面。在表單校驗的時候禁止提交表單到服務(wù)器,防止錯誤數(shù)據(jù)提交給服務(wù)器、防止頁面刷新。
//window.event.returnValue不兼容火狐瀏覽器
9.
window.event對象的成員:
srcElement,獲得事件源對象。幾個事件共享一個事件響應(yīng)函數(shù)用。****_click(object sender,EventArgs e)//只有IE支持。
button,發(fā)生事件時鼠標按鍵,1為左鍵,2為右鍵,3為左右鍵同時按。//要測試event.button的值的時候,請在onmousedown事件中測試。如果在onclick事件中只能識別鼠標左鍵的單擊。
10.
window.location.href=‘';//重新導(dǎo)航到新頁面,可以取值,也可以賦值。
window.location.reload();//刷新當(dāng)前頁
location.search:獲得url(?號以后的,包含?)
11.
(1)onload:網(wǎng)頁加載完畢時觸發(fā),瀏覽器是一邊下載文檔、一邊解析執(zhí)行,可能會出現(xiàn)JavaScript執(zhí)行時需要操作某個元素,這個元素還沒有加載,如果這樣就要把操作的代碼放到body的onload事件中,或者可以把JavaScript放到元素之后。元素的onload事件是元素自己加載完畢時觸發(fā),body onload才是全部加載完成
(2)onunload:網(wǎng)頁關(guān)閉(或者離開)后觸發(fā)。
(3)onbeforeunload:在網(wǎng)頁準備關(guān)閉(或者離開)前觸發(fā)。
<body onbeforeunload=“return ‘真的要放棄發(fā)帖退出嗎?'; ">。顯示的文字隨瀏覽器版本而有差異。
12.
js中調(diào)用方法的時候就是把指針賦給它
var t=add;
function add(){}
13.
window.event.clientX是客戶端可視界面
14.
一、setInterval(code,time)方法可以每隔 time毫秒執(zhí)行一次code.
其中的code有兩種方式:
1.直接傳入 某個方法 對象 - setInterval(showTime,1000);
2.直接傳入要執(zhí)行 的 js代碼字符串 - setInterval("alert(1);",1000);
二、關(guān)于 for in (用來循環(huán) 對象的屬性和值)
使用 for in 來循環(huán)數(shù)組時,會將 數(shù)組的屬性先循環(huán)出來
然后再 循環(huán) 數(shù)組里的元素 ,但此時 循環(huán)出來的 k 是元素的下標
三、innerHTML
將 字符串 添加到 對應(yīng)的 雙標簽 中間。
并且立刻對 該字符串進行解析,如果符合html標簽的語法,
則,立即調(diào)用 瀏覽器的解析器,對該字符串進行html解析,并
生成對應(yīng)的 dom 對象,最后,將該dom對象,追加到被添加的
對象的 子元素 集合(ChildNodes)中。
15.
ShowModalDialog函數(shù)的功能:
打開一個子窗口,并且可與父窗口相互傳遞數(shù)據(jù),它與window.open的最大區(qū)別
就在于由ShowModalDialog打開子窗口后,父窗口將不能操作。
使用方法:
vReturnValue = window.showModalDialog(sURL [, vArguments] [,
sFeatures])
參數(shù)說明:
sURL
必選參數(shù),類型:字符串。用來指定對話框要顯示的文檔的URL。
vArguments
可選參數(shù),類型:變體。用來向?qū)υ捒騻鬟f參數(shù)。傳遞的參數(shù)類型不限,包括數(shù)
組等。對話框通過window.dialogArguments來取得傳遞進來的參數(shù)。
sFeatures
可選參數(shù),類型:字符串。用來描述對話框的外觀等信息,可以使用以下的一個
或幾個,用分號“;”隔開。
dialogHeight 對話框高度,不小于100px,IE4中dialogHeight
和 dialogWidth 默認的單位是em,而IE5中是px,為方便其見,在定義modal
方式的對話框時,用px做單位。
dialogWidth: 對話框?qū)挾取?
dialogLeft: 距離桌面左的距離。
dialogTop: 離桌面上的距離。
center: {yes | no | 1 | 0 }:窗口是否居中,默認yes,但仍可以指定
高度和寬度。
help: {yes | no | 1 | 0 }:是否顯示幫助按鈕,默認yes。
resizable: {yes | no | 1 | 0 } [IE5+]:是否可被改變大小。默
認no。
status: {yes | no | 1 | 0 } [IE5+]:是否顯示狀態(tài)欄。默認為yes[
Modeless]或no [Modal]。
scroll:{ yes | no | 1 | 0 | on | off }:指明對話框是否顯示滾動
條。默認為yes。
參數(shù)傳遞方法:
父窗口向子窗口傳遞參數(shù)采用ShowModalDialog的第2個參數(shù)即可,父窗口要獲取
子窗口傳回的參數(shù)則可通過ShowModalDialog函數(shù)的返回值獲取。
子窗口獲取父窗口參數(shù)的方法為采用子窗口window對象dialogArguments屬性獲
取,例如:
parent.html
<script>
var obj = new Object();
obj.name="51js";
window.showModalDialog
("modal.html",obj,"dialogWidth=200px;dialogHeight=100px");
</script>
modal.html
<script>
var obj = window.dialogArguments
alert("您傳遞的參數(shù)為:" + obj.name)
</script>
子窗口向父窗口返回參數(shù)采用window.returnValue屬性,如:
window.returnValue=1;
window.close();
相關(guān)文章
JavaScript實現(xiàn)檢查頁面上的廣告是否被AdBlock屏蔽了的方法
這篇文章主要介紹了JavaScript實現(xiàn)檢查頁面上的廣告是否被AdBlock屏蔽了的方法,其實就是利用JS檢測div的名稱和樣式名稱實現(xiàn),需要的朋友可以參考下2014-11-11js結(jié)合css實現(xiàn)登錄后才能復(fù)制的效果實例
很多網(wǎng)站都有登錄后才能復(fù)制的限制,什么原理呢?css屬性user-select:none,通常會采用這種方式來禁止復(fù)制文本。但瀏覽開發(fā)者工具-審查元素,取消此樣式后,就可以選中文本了。想要完整地禁止復(fù)制,還需要通過js控制選擇的內(nèi)容。2023-07-07JS實現(xiàn)添加,替換,刪除節(jié)點元素的方法
這篇文章主要介紹了JS實現(xiàn)添加,替換,刪除節(jié)點元素的方法,實例分析了javascript針對節(jié)點元素的替換、刪除及常用的幾種添加技巧,需要的朋友可以參考下2016-06-06微信小程序全局變量GLOBALDATA的定義和調(diào)用過程解析
這篇文章主要介紹了微信小程序全局變量GLOBALDATA的定義和調(diào)用過程解析,文中通過示例代碼介紹的非常詳細,對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下2019-09-09