JS编程接口
文章平均质量分 74
JS编程接口
一生注定学霸命
这个作者很懒,什么都没留下…
展开
-
事件委托(事件代理)
1.举例说明有三个同事预计会在周一收到快递。为签收快递,有两种办法:一是三个人在公司门口等快递;二是委托给前台MM代为签收。现实当中,我们大都采用委托的方案(公司也不会容忍那么多员工站在门口就为了等快递)。前台MM收到快递后,她会判断收件人是谁,然后按照收件人的要求签收,甚至代为付款。这种方案还有一个优势,那就是即使公司里来了新员工(不管多少),前台MM也会在收到寄给新员工的快递后核实并代为签收。这里其实还有2层意思的:第一,现在委托前台的同事是可以代为签收的,即程序中的现有的dom节点是有事件的;原创 2021-05-01 18:15:27 · 92 阅读 · 0 评论 -
DOM 事件模型
1.事件事件是用户或者浏览器自己执行的某种动作,是文档或者浏览器发生的一些交互瞬间,比如点击(click)按钮等,这里的click就是事件的名称。JS与html之间的交互是通过事件实现的,DOM支持大量的事件。2.DOM事件DOM是树形的,当我们在页面上单击一个按钮时,先发生事件捕获,也就是从不具体的节点到最具体的节点,一般是从document对象开始从外网内传播,然后再事件冒泡,也就是事件是由最具体的元素接收,然后逐级向上传播,在每一级的节点上都会发生,直到传播到document对象,...原创 2021-05-01 18:00:12 · 80 阅读 · 0 评论 -
6-7 JS编程接口(DOM事件、事件委托、封装事件委托)
DOM事件与事件委托1.事件是什么?JavaScript 创建动态页面事件是可以被 JavaScript 侦测到的行为。网页中的每个元素都可以产生某些可以触发 JavaScript 函数或程序的事件。触发事件的对象称为事件发送者;接收事件的对象称为事件接收者。比如说,当用户单击按钮或者提交表单数据时,就发生一个鼠标单击(onclick)事件,需要浏览器做出处理,返回给用户一个结果。2.事件对象每次触发DOM事件时会产生一个事件对象(也称event对象)参数e接收事件对象事件对象也原创 2021-05-01 17:20:06 · 160 阅读 · 0 评论 -
6-6 JS编程接口(点击事件、addEventListener、捕获与冒泡、阻止滚动)
DOM事件与事件委托高频面试题目1.点击事件代码<div class="爷爷"> <div class="爸爸"> <div class="儿子"> 文字 </div> </div></div>给三个div分别添加时间监听 fnYe/fnBa/fnEr提问1:点击了谁?1.点击文字,算不算点击儿子?2.点击文字,算不算点击爸爸?3.点击文字,算不算点击爷爷?答:都算提问原创 2021-05-01 14:51:12 · 563 阅读 · 0 评论 -
6-5 JS编程接口(jQuery风格封装)
用jQuery风格封装1.链式风格也叫jQuery风格window.jQuery() 是我们提供的全局函数特殊函数jQuery1.jQuery(选择器)用于获取对应的元素2.它却不返回这些元素3.相反,它返回一个对象,成为jQuery构造出来的对象4.这个对象可以操作对应的元素2.jQuery选择器是什么?jQuery选择器是允许通过标签名、属性名或内容对DOM元素进行快速、准确的选择,而不必担心浏览器的兼容性,通过jQuery选择器对页面元素的精准定位,才能完成元素属性和行为的处理原创 2021-04-29 23:32:24 · 297 阅读 · 1 评论 -
6-4 JS编程接口(DOM前三节总结)
1.什么是DOM?简单来说,DOM是一套对文档的内容进行抽象和概念化的方法。2.DOM 文档对象模型理解相似于现实中的“世界对象模型”,比如“汽车”、“房子”、“树”等客观事物。描述抽象概念:“左边第三栋房子”等3.模型:...原创 2021-04-29 15:11:34 · 144 阅读 · 0 评论 -
6-3 JS编程接口(手写DOM库)
封装DOM手写一个JQueryDOM是JS里面最常用的一个接口,会DOM就会网页上任何一个操作1.什么叫封装?相当于把一个复杂的东西打包成一个服务或者是盒子,只需要用一些简单的命令就可以操作它1.1举例电脑笔记本就是 CPU、内存、硬盘、主板、显卡 的封装(或者手机也是)用户只需要接触显示器、键盘、鼠标、触控板等设备即可操作复杂的计算机1.2接口被封装的东西需要暴露一些功能给外部这些功能就是接口,比如 USB接口、HDMI接口设备只要支持这些接口,即可与被封装的东西通讯比如原创 2021-04-29 11:03:36 · 159 阅读 · 0 评论 -
6-2 JS编程接口(DOM操作、跨线程)
DOM操作是跨线程的问:为什么DOM操作比较慢?JS世界中——浏览器的功能划分浏览器分为渲染引擎(渲染HTML和CSS)和JS引擎(执行JS的)1.跨线程操作各线程各司其职JS引擎不能操作页面,只能操作JS(如:window对象、Object对象等)渲染引擎不能操作JS,只能操作页面document.body.appendChild(div1)跨线程通信当浏览器发现JS在 body 里加了一个 div1 对象浏览器会通知渲染引擎在页面里也新增一个 div 元素新增的 d原创 2021-04-28 17:10:54 · 212 阅读 · 0 评论 -
6-1 JS编程接口(DOM简介、获取元素的API、节点的增删改查)
前置知识理解JS语法,如变量、if els、循环会背JS的七种数据类型会背JS的五个falsy值知道函数是对象,数组也是对象会用div和span标签会简单的CSS布局一、DOM简介1.网页其实是一棵树2.JS如何操作这棵树2.1 浏览器往window上加一个document即可有了这个document就可以操作这棵树了window.document 就可以获取整个网页的所有元素当点中document时,整个网页都被选中了2.2 JS用document操作网页这种思原创 2021-04-26 22:51:04 · 307 阅读 · 0 评论