初識前端 DOM模型

2021-09-28 18:08:49 字數 1263 閱讀 6812

建立節點

插入節點 分類

"did"

class

="dcls" name=

"dnm"

>

<

/div>document.getelementsbytagname()

document.getelementsbyclassname()

document.getelementsbyname()

注意除了通過id之外,其他都是返回陣列,需要通過索引精準定位到節點

createtextnode()

innerhtml

不同的元素其插入方法不同

insertbefore()

// 得到div物件

var div = document.

getelementbyid

("mydiv");

// 方式一

// 建立img標籤

var img = document.

createelement

("img");

// 設定img標籤的屬性 src

;// 設定的高度和寬度

img.width =

"200"

;img.height=

"200"

;console.

log(img)

;// 將img標籤追加到div標籤的內部最後

div.

(img)

;// 方式二

// 建立img標籤

var img = document.

createelement

("img");

// 設定img標籤的屬性 src

// 將img標籤追加到div標籤的內部最後

div.

(img)

;// 方式三

var img =

";// 賦值

div.innerhtml += img;

WEB前端 盒子模型初識

border border width border style border color 複製 邊框屬性 設定邊框樣式 border style 邊框樣式用於定義頁面中邊框的風格,常用屬性值如下 none 沒有邊框即忽略所有邊框的寬度 預設值 solid 邊框為單實線 最為常用的 dashed 邊...

前端隨筆初識前端

接上章 table tr 行 td 列 width 的寬度 height 的高度 border 的邊框 cellspacing 單元格與單元格之間的間距 預設大約是2畫素 cellpadding 單元格與內容之間的空隙 預設值是0 bgcolor 背景顏色 bordercolor 邊框顏色 alig...

Dom物件模型

1.文件物件 節點分為元素節點 屬性節點 文字節點。window.onload function var box document.getelementbyid box 通過id查詢元素節點,dom等待 alert box.id 元素id值 alert box.tagname 元素名 alert b...