[ Day 11 ] - DOM
DOM
DOM 是什麽呢？
DOM（Document Object Model）
当浏览器进入网页时，将 HTML 文件会以树状结构的解析，此称为 DOM Tree。
<html>
<head>
<title>我是网站</title>
</head>
<body>
<h1>主标题</h1>
<p>段落</p>
</body>
</html>
依以上 HTML 范例，所产生的 DOM Tree 示意图如下
也就是说，可以透过 DOM 提供的介面，用来控制网页上的节点与内容，做出网页的效果
简单说明使用 DOM API 取得预期节点：
// 找出 DOM 的节点为 h1 这个元素
document.querySelector('h1');
// 找出 DOM 节点为 class = .box 的元素
document.querySelector('.box');
// 找到 DOM 中，id 为 test 的元素
document.getElementById('test');
参考资料与学习资源
- 0 陷阱！0 误解！8 天重新认识 JavaScript！
- JavaScript 指南
- 六角学院 - JavaScript 必修篇 - 前端修练全攻略
本日小节
终於进入比较重点的部份了，要来练习操控网页元素了！
这是我的学习纪录，欢迎各路大神指点指教！
有任何问题欢迎传讯息给我，我们下次见
<<: IOS、Python自学心得30天 Day-23 Firebase衔接Python-1
Day30. 是结束，也能是开始 - Review
今天是铁人赛的最後一天，我们的内容已经在昨天全数告一段落。 我们今天来分结构回顾一下我们的 30天，...
Unity自主学习(三十)：完美物件移动
那昨天後来自己在玩写好的脚本时，发现了会有逻辑上的错误，导致物件撞墙时，会不断产生抖动，而之後也去U...
[Day13] Esp32s用STA mode + LED
1.前言 今天比较晚po文，开学了超多事情要忙，课也超多(三条线)。好了抱怨时间结束!!这篇如前两篇...
DAY 09 - 由後端主动告诉你资料更新 - websocket
回想一下开发经验，当後端资料状态有更新... 不知道大家有没有遇到，在开发的时候，如果状态更新但我们...
05 - Tmuxinator - Tmux sessions 管理工具
在针对各种不同的专案进行开发时，会需要在不同位置开启终端，并执行不同的指令， Tmux 并不会纪录每...