Dom的高階應用

2021-08-08 18:41:05 字數 1668 閱讀 5090

1.對**的操作

html  

屬性或方法 說明

caption 儲存著元素的引用

tbodies 儲存著元素的htmlcollection集合

tfoot 儲存著對元素的引用

thead 儲存著對元素的引用

rows 儲存著對元素的htmlcollection集合

rowindex 返回該**行在**內的索引值

sectionrowindex 返回該**行在其所在元素(,等元素)的索引值

cells 儲存著元素中單元格的htmlcollection

cellindex 返回該單元格在該**行內的索引值。

createthead() 建立元素,並返回引用

createtfoot() 建立元素,並返回引用

createcaption() 建立元素,並返回引用

deletethead() 刪除元素

deletetfoot() 刪除元素

deletecaption() 刪除元素

deleterow(pos) 刪除指定的行

insertrow(pos) 向rows集合中的指定位置插入一行

元素新增的屬性和方法

屬性或方法 說明

rows 儲存著元素中行的htmlcollection

deleterow(pos) 刪除指定位置的行

insertrow(pos) 向rows集合中的指定位置插入一行,並返回引用

元素新增的屬性和方法

屬性或方法 說明

cells 儲存著元素中單元格的htmlcollection

deletecell(pos) 刪除指定位置的單元格

insertcell(pos) 向cells集合的指定位置插入乙個單元格,並返回引用

2.form表單

獲取表單可以使用

1.document.forms   返回form集合

2.document.forms[0]

3.document.forms['myform3']

3.document.myform

4.document['myform']

獲取表單中的字段

f2.elements : 獲取表單中所有的元素。

document.forms[0].elements['username'] 獲取name為username的字段物件

document.forms[0].username

表單驗證:

如果希望在表單提交之前,能夠對表單中輸入的內容資料進行校驗,如果校驗通過,允許提交表單,如果校驗不通過,希望還留在當前頁面,不觸發submit事件。

在當前表單物件上新增onsubmit事件監聽

note:當checkform函式的返回結果為true,那麼表單可以正常提交到action所指定的url,如果返回結果為false,那麼還留在當前頁面。

3.cookie:

通過document.cookie直接訪問

設定cookie:

document.cookie = "username=a1";

document.cookie = "password=a2";

獲取cookie:

var str = document.cookie;

str列印出的結果為:username=a1;password=a2;

DOM操作應用高階

tbodies 陣列 thead 乙個元素 tfood 乙個元素 rows,cells 小例子 隔行變色,滑鼠移入變色移出還原 window.onload function 版本1 基礎版本 字串比較 版本1 忽略大小寫 大小寫轉換 版本1 模糊搜尋 search的使用 找到並返回字串出現的位置,沒...

DOM高階知識

需求 使用element.style.left是無法獲取值的,只能給style.left賦值 因此需要用offset獲取該元素在頁面中的位置 1 offsetleft 表示自己的左上角相對於乙個叫做offsetparent的水平偏移量 1 標準流 浮動 非脫標定位 offsetparent是誰?bo...

dom高階操作

1.查詢dom元素document.queryselector與document.queryselectorall document.queryselector element document.queryselector element document.queryselector div doc...