1.查詢節點:
孩子節點:children 所有的子元素
firstelementchild 第乙個子元素
lastelementchild 最後乙個子元素
firstchild 第乙個子節點
lastchild最後乙個節點
實際中一般不會用系欸但,主要是對元素進行操作
兄弟節點: previouselementsibling 上乙個兄弟元素
nextelementsibling 下乙個兄弟元素
父節點:parentnode
2.新增節點
parent.insertbefore(a,y) 往任意指定位置y的前面新增a
如果對於頁面中已有的元素,就是剪下的效果
3.轉殖節點
clonenode(deep)
deep是布林型別,為true,表示深拷貝,標籤+內容,如果有id值,需要重新設定,頁面中id值是唯一的
如果值為false,表示淺拷貝,只複製標籤
注意:拷貝出來的和原來之間的修改是互不影響的
4.刪除節點
parent.removechild() 父元素呼叫
5.建立節點
1.document.write() 只能往頁面中寫,頁面載入產生文件流存在覆蓋問題
2.innerhtml 可以識別標籤,慎用,也會存在覆蓋問題
3.document.createelement(tagname)
(1)建立出來的元素是儲存在記憶體中
(2) 需要手動新增到頁面中
(3) 引數:字串型別的標籤名
事件-----概念:觸發-----響應的機制
三要素:事件源,事件名稱,事件處理程式
註冊事件:事件源 on + 事件名稱 = function()
事件觸發了才會執行函式
函式不需要帶哦用,瀏覽器幫我們呼叫執行
表單屬性-------常用的有:type name value checked selected disabled
布林型別的有: checked selected disabled
具體說明: 在標籤中,只要有這個屬性,就能起到作用,dom物件屬性值是布林型別(true,false)
例題:實現全選
頁面結構:
doctype html
>
<
html
>
<
head
lang
="en"
>
<
meta
charset
="utf-8"
>
<
title
>
title
>
<
style
>
* .wrap
table
th, td
th td
tbody tr
tbody tr:hover
style
>
head
>
<
body
>
<
div
class
="wrap"
>
<
table
>
<
thead
>
<
tr>
<
th>
<
input
type
="checkbox"
id="j_cball"
/>
th>
<
th>菜名
th>
<
th>飯店
th>
tr>
thead
>
<
tbody
id="j_tb"
>
<
tr>
<
td>
<
input
type
="checkbox"
/>
td>
<
td>紅燒肉
td>
<
td>田老師
td>
tr>
<
tr>
<
td>
<
input
type
="checkbox"
/>
td>
<
td>西紅柿雞蛋
td>
<
td>田老師
td>
tr>
<
tr>
<
td>
<
input
type
="checkbox"
/>
td>
<
td>紅燒獅子頭
td>
<
td>田老師
td>
tr>
<
tr>
<
td>
<
input
type
="checkbox"
/>
td>
<
td>日式肥牛
td>
<
td>田老師
td>
tr>
tbody
>
table
>
div>
body
>
html
>
js的**
這個題目中主要用到的一種思想就是假設成立法,假設乙個結論,然後去推翻結論的過程。
dom節點及對節點的常用操作方法
在說dom節點前,先來看看頁面的呈現 dom渲染流程 1 瀏覽器解析html原始碼,然後建立乙個dom樹。在dom樹中,每乙個html標籤都有乙個對應的節點 元素節點 並且每乙個文字也都有乙個對應的節點 文字節點 dom樹的根節點就是documentelement,對應的是html標籤。2 瀏覽器解...
dom節點及對節點的常用操作方法
dom節點及對節點的常用操作方法 在說dom節點前,先來看看頁面的呈現 dom渲染流程 1 瀏覽器解析html原始碼,然後建立乙個dom樹。在dom樹中,每乙個html標籤都有乙個對應的節點 元素節點 並且每乙個文字也都有乙個對應的節點 文字節點 dom樹的根節點就是documentelement,...
jQuery對元素 節點的操作
一 文字內容的操作 方法 text text val 例子 div div 獲取 div元素 console.log div.text 獲取文字內容 div.text aaaaa 設定了文字的內容 二 html內容的操作 html 用於獲取第乙個匹配元素的 html 內容 html val 用於設定...