文档(Document) 和 对象(Events)
写了那么多实例, 最近有同学反应讲一点DOM 和 事件相关方面的基础知识. 可能有些还没有入门, 需要补充点基础知识. 从今天开始, 我们开始讲解一些基本的JS知识.
文档和事件, 在Javascript中是必不可少的一部分, 他们的作用就是与用户进行交互的技术. 而进行交互, 就得谈到用户体验上去了, 用户体验设计得好, 你的用户就会停留在这里. 所以浏览器会允许前端编程者去控制浏览器里已有的对象结构. 其实就是编程了.
在这个章节我们就学习在页面上怎么去操作他们.不过首先我们来看下接下来要讲的知识点:
1. 浏览器的全局环境
主要是了解浏览器中有哪些全局对象供我们编程的人去调用和使用, 通过这些全局对象, 如何来设计自己的程序. 使自己的程序更能够体现这些技术.
2. DOM
DOM是什么? 就是Document Object Model的缩写, 翻译过来就是文档对象模型. 文档对象模型不明白吧, 其实就是HTML结构, 在JS中建立对应的节点对象. 供编程的人来操作HTML,比如创建节点, 修改节点, 删除节点等等.我们涉及到的知识点:
a. 明白DOM 节点
b. 访问DOM节点
c. 基本的节点属性
d. 属性和自定义属性
e. 在DOM中搜索标签元素
f. 修改文档标签元素
g. 使用document.write
h. 表单和表格的使用
3. 视图和位置
这里主要讲解的是盒子模型的重新理解, JS中的CSS操作, 重新理解CSS的位置, 以及坐标.
a. 盒子模型
b. JS中的CSS
c. CSS的位置体现
d. 坐标计算
4. 事件(Event)
事件是捕获用户操作浏览器页面的监听器, 监听用户的操作行为, 让程序作出相应的响应. 让用户明白自己在这个页面上做了什么.
我们需要介绍事件的相关知识点:
a. 浏览器事件的概要
b. 鼠标事件
c. 焦点事件和失去焦点事件
d. 事件委托
e. 键盘事件
f. 获取事件对象
g. 冒泡和捕获
h. 默认的浏览器行为
5. 将脚本运用到HTML结构中.
这里我们主要是了解JS代码的渲染情况, 代码的嵌入, 已经动态加载JS文件的相关操作. 所以我们的知识点, 主要有以下几点:
a. JS代码的渲染
b. JS代码引入
c. 动态加载JS代码