iT邦幫忙

2021 iThome 鐵人賽

DAY 27
0
Modern Web

JS進入新手村,我好害怕系列 第 27

Day27:終於要進去新手村了-HTML DOM 基本觀念

今天要先說到關於階層的部分,因為明後天的文章會是關於HTML與JS簡單的一些互動,一樣是由彭彭影片內容加上自己的註解。

首先我們先看到下方的程式碼:

<html>
    <body>
       <h3>HTML DOM</h3>
       <div>
          <span>階層結構</span>
          <span>樹狀結構</span>
       </div>
    </body>
</html>

首先我們要先認識一下結構,HTML DOM的中文是文件物件模型,其實就是將HTML內的各標籤都視為一個物件,這些物件會有階層,整體展開會變成樹狀圖,我們就以上方程式碼示意一下他的樹狀結構為何。

https://ithelp.ithome.com.tw/upload/images/20211012/20130509w5VQCOxjoA.jpg

我們可以看到最上面windows的部分就是我們的作業系統,在作業系統底下分別有history歷史紀錄,document文件(這裡指的是html文件)以及screen解析度,再往下一層一層的分門別類。

下一篇文章我會用一些舉例來加深關於Html Dom的記憶。

參考資料:
https://www.youtube.com/watch?v=iZ3LfVujGCM
https://ithelp.ithome.com.tw/articles/10202689


上一篇
Day26:終於要進去新手村了-Javascript-函式-物件-建構式
下一篇
Day28-終於要進去新手村了-HTML DOM 觀念介紹
系列文
JS進入新手村,我好害怕30

尚未有邦友留言

立即登入留言