---
# System prepended metadata

title: 1/27 JavaScript
tags: [JavaScript]

---

# 1/27 JavaScript 
###### tags: `JavaScript`

# 109  Document物件
![](https://i.imgur.com/7efu02K.png)
id 身分證 不可重複
name 姓名 可以重複
# 111 querySelector()
![](https://i.imgur.com/JU4WW5S.png)
![](https://i.imgur.com/JeQOMGg.png)
# 113 圖片(image)物件
![](https://i.imgur.com/t0YsasI.png)
https://www.image-map.net/
![](https://i.imgur.com/Zja3oSi.png)
# 114 表單(form)物件
![](https://i.imgur.com/zX1GVzf.png)
# 115 表單(form)物件
![](https://i.imgur.com/cBw1ilR.png)
![](https://i.imgur.com/aKAA5PS.png)
# 117 DOM的標準化
![](https://i.imgur.com/7vts0SS.png)
# 118 DOM的標準化
![](https://i.imgur.com/kbI5gb7.png)
https://dom.spec.whatwg.org/
# 119 BOM物件模型架構(Browser Object Model)
![](https://i.imgur.com/PezcpiA.png)
# 120 什麼是DOM
![](https://i.imgur.com/6lhALjm.png)
# 121 html網頁
![](https://i.imgur.com/qZUZ1Ak.png)
# 122 HTML網頁解析出的樹狀結構
![](https://i.imgur.com/N9JTKRC.png)
https://www.w3schools.com/xml/dom_nodetype.asp
# 123 瀏覽節點
![](https://i.imgur.com/CIbTt5b.png)
# 124 尋找及存取節點資料
![](https://i.imgur.com/8Y5xhlG.png)
# 125 DOM範例
[2]換行及空格都算一個節點:圖片![](https://i.imgur.com/OIMDEeJ.png)
# 127 範例程式
![](https://i.imgur.com/7PyqpUu.png)
# 128 新增及移除元素
已經存在的元素
![](https://i.imgur.com/LWrbvaW.png)
![](https://i.imgur.com/4m3BhiE.png)
# 129 關於屬性資料
![](https://i.imgur.com/JJl4d6Y.png)
![](https://i.imgur.com/0hkktSo.png)
# 130 範例程式
![](https://i.imgur.com/2OZJMTt.png)
# 131 單元十:Drag&Drop
![](https://i.imgur.com/a3gLp9R.png)
# 133 Drag&Drop API
![](https://i.imgur.com/8pBPrUT.png)
# 134 元素拖放
任何一個元素都不可以被放置
target被觸發
![](https://i.imgur.com/UIsNwCZ.png)
![](https://i.imgur.com/EBfJWZy.png)
https://zh.wikipedia.org/wiki/%E4%BA%92%E8%81%94%E7%BD%91%E5%AA%92%E4%BD%93%E7%B1%BB%E5%9E%8B
