js-DOM事件流 DOM事件流 1. 事件流 描述从页面中接收事件的顺序。 2. DOM事件流 事件发生时会在节点元素之间按照特定的顺序传播。此传播过程即为DOM事件流。 3. DOM事件流三阶段 捕获阶段:从windows对象依次向下传播,到达目标节点。捕获阶段不会相应任何事件。 当前目标阶段:目标节点触发事件。 冒泡阶段:从当前节点依次向上传播,直到windows对象。 DOM事件流三阶段 4. 注意 2023-06-05 front-end #js
js事件对象 事件对象 1. 事件对象的定义与理解 事件对象的官方定义:event事件对象代表事件的状态,比如按键的状态,鼠标的位置等等。 理解:当DOM树中某一个元素事件被触发的时候,会同时自动产生一个用来描述事件的所有相关信息的对象,这就是event(事件对象)。 2. 事件对象的使用语法 2.1 可以直接通过event来获取 2.2 可以通过函数传参数的方式获取: eventTarget.oncli 2023-06-05 front-end #js
js事件高级 js事件高级 1. 注册事件(绑定事件) 【传统的注册方式】: var btn = document.getElementById(‘btn’);//获取事件源 btn.onclick = function() {alert(‘hhhhh’)}//事件类型+事件处理程序 特点:注册事件的唯一性(同一个元素同一个 2023-06-05 front-end #js
js节点操作 js节点操作 利用DOM树可以把节点划分为不同的层级关系。 父级节点 node.parentNode 这个属性返回node节点最近的一个父节点 子节点 node.childNode 返回指定节点的所有子节点的集合 !注意:包括文本节点甚至空格等都会被一起返回, 若只想获得子元素节点就别用了 2.1 更推荐的方法 node.children只读属性,只返回所有子元素节点。 2023-05-23 front-end #js
js事件基础 js事件基础 1. 事件概述 js使我们有能力创造动态页面,其中,事件是可以被js侦测到的行为。 2. 事件三要素 事件源:谁被触发 e.g.按钮 事件类型: 怎么触发 e.g.点击触发 事件处理程序:通过函数赋值的方式 e.g.弹出对话框 3. 执行事件的步骤 获取事件源 注册(绑定事件) 添加事件处理程序(函数赋值) 4. 常见的鼠标事件 2023-05-23 front-end #js
js-DOM DOM 1. DOM的定义 DOM:document object model文档对象模型,是W3C组织推荐的处理可扩展标记语言的标准编程接口,通过这些接口可以改变网页的内容、结构和样式。 2. DOM树 文档:一个页面就是一个文档,DOM中用document表示 元素:页面中所有的标签都是元素,DOM中用element表示 节点:页面中所有的内容都是节点,DOM中用node表示 DO 2023-05-17 front-end #js #DOM
js简单数据类型和复杂数据类型 JS简单数据类型和复杂数据类型 简单数据类型 - 简单数据类型,又称值类型,因为在存储时变量中存储的是值本身。 存在栈中 e.g. string, number, boolean, undefined, null等 复杂数据类型 复杂数据类型,又称引用类型,因为在存储时变量中存储的是地址 存在堆中 e.g. Object, Array,Date等 .red { 2023-05-17 front-end #js
js对象 js中的对象数据结构 为什么需要对象? 保存一个值,我可以选择用变量来存 保存多个值,我可以选择用数组来存 那么如果我想存储一个人的完整信息,那么我就需要对象啦~ 对象的组成:属性 + 方法 如何创建一个对象呢? 利用字面量来进行创建 : 键值对 e.g. var star = { name: xxx, age: 18, sayHi: f 2023-05-17 front-end #js
js预解析 Js预解析 1. 预解析的背景 JavaScript代码是由浏览器中的javaScript解析器来执行的,但是分为两步:预解析 + 代码执行。 2. 预解析做了什么? 预解析阶段,js引擎会把js文件里所有的var变量声明和function函数声明提升到当前作用域的最前面。 3. 例子 console.log(num); var num = 10; 上述代码的输出结果是und 2023-05-17 front-end #js
js初识 JS基础 计算机语言:机器语言,汇编语言,高级语言 机器语言和汇编语言都是直接对硬件操作,但汇编语言采用英文缩写的标识符 编程语言:汇编语言 + 高级语言 编程语言 ( e.g. JavaScript) v.s. 标记语言( e.g. HTML): 标记语言:不向计算机发出指令,是用来被读取的 编程语言:具有很强的逻辑和行为能力,是主动的。 JavaScript是什么? JavaScr 2023-05-17 front-end #js