JavaScript Web APIs学习总结

以后声明变量我们有限使用哪一个

const
有了变量先给const如果发现它后面是要被修改的再改为let

为什么const声明的对象可以修改里面的属性

因为对象是引用类型里面存储的是地址只要地址不变就不会报错
建议数组和对象使用const来声明

什么时候使用let声明变量

如果基本数据类型的值或者引用类型的地址发生变化的时候需要用let
比如一个变量进行加减运算比如for循环中的i++

Web API阶段我们学习哪两部分

DOM和BOM

DOM是什么有什么作用

DOM是文档对象模型
操作网页内容可以开发网页内容特效和实现用户交互

DOM树是什么

将HTML文档以树状结构直观的表现出来我们称之为文档树或者DOM树
作用文档树直观的体现了标签与标签之间的关系

DOM树怎么创建的

浏览器根据html标签生成的JS对象DOM对象
DOM的核心就是把内容当对象来处理

document是什么

是DOM里面提供的一个对象
网页所有内容都在document里面

获取一个DOM元素我们使用谁能直接操作修改吗

querySelector()
可以直接操作修改

获取多个DOM元素我们使用谁能直接修改吗如果不能可以怎么做到修改

querySelectorAll()
不可以只能通过遍历的方式依次给里面的元素做修改

获取页面中的标签我们最终常用哪两种方式

querySelectorAll()
querySelector()

它们两者的区别是什么

querySelector()只能选择一个元素可以直接操作
querySelectorAll()可以选择多个元素得到的是为数组要遍历得到每一个元素

它们两者小括号里面的参数有神马注意事项

里面写css选择器
必须是字符串也就是必须加引号

设置/修改DOM元素内容有哪2种方式

元素.innerText属性
元素.innerHTML属性

三者的区别是什么

元素.innerText属性只识别文本不能解析标签
元素.innerHTML属性 能够识别文本能够解析标签
如果还在纠结到底用谁可以选择innerHTML

设置/修改元素样式属性通过什么属性引出来

style

如果需要修改一个div盒子的样式比如padding-left如何写

element.style.paddingLeft=‘300px’
小驼峰命名法
不要忘记加单位

使用className有什么好处

可以同时修改多个样式

使用className有什么注意事项

直接使用className赋值会覆盖以前的类名

使用className和classList的区别

前者修改大量样式的更方便
后者修改不多样式的时候方便
classList是追加和删除不影响以前类名

定时器函数有什么作用

可以根据时间自动重复执行某些代码

定时器函数如何开启

setInterval(函数名时间)

定时器函数如何关闭

let 变量名=setInterval(函数间隔时间)
clearInterval(变量名)

什么是事件监听

就是让程序检测是否有事件产生一旦有事件触发就立即调用一个函数做出响应也称为注册事件

事件监听三要素是什么

事件源谁被触发了
事件类型用什么方式触发点击还是鼠标经过
事件处理程序要做什么事情

事件对象是什么

也是个对象这个对象里有事件触发时的相关信息

事件对象在哪里

在事件绑定的回调函数的第一个参数就是事件对象

环境对象this是什么

它代表着当前函数运行时所处的环境

判断this指向的粗略规则是什么

谁调用this就是谁

回调函数

把函数当作另外一个函数的参数传递这个函数就是回调函数
回调函数本质还是函数只不过把它当成参数使用
使用匿名函数作为回调函数比较常见

阻止冒泡如何做

事件对象.stopPropagation()

阻止元素默认行为怎么做

e.preventDefault()

事件委托的好处是什么

减少注册次数提高了程序性能

事件委托是委托给了谁父元素还是子元素

父元素

如何找到真正触发的元素

事件对象.target.tagName

页面加载事件有哪两个如何添加

load事件监听整个页面资源给window添加
DOMContentLoaded给document添加无需等待样式表、图像等完全加载

被卷去的头部或者左侧用哪个属性是否可以读取和修改

scrollTop/scrollLeft
可以读取也可以修改

检测页面滚动的头部距离被卷去的头部用哪个属性

document.documentElement.scrollTop

offsetWidth和offsetHeight是得到元素什么的宽高

内容+padding+border

offsetTop和offsetLeft得到位置以谁为准

带有定位的父级
如果都没有则以 文档左上角 为准

总结

实例化日期对象怎么写

new Date()

日期对象方法里面月份和星期有什么注意的

月份是0~11 星期是0 ~6

获取时间戳有那三种方式重点记住哪个

date.getTime()
Date.now()
+new Date()
重点记住+new Date()因为可以返回当前时间戳或者指定的时间戳

什么是DOM结点

DOM树里面每一个内容都称之为结点

DOM结点的分类

元素节点 比如div标签
属性节点 比如class属性
文本节点 比如标签里面的文字

我们重点记住哪个节点

元素节点
可以更好地让我们理清标签元素之间的关系

查找父节点用哪个属性

parentNode

查找所有子节点用哪个属性

children

查找兄弟节点用哪个属性

nextElementSibling
previousElementSibling

location.href属性获取完整的url地址对其赋值时用于地址的跳转

search属性获取地址中携带的参数符号?后面部分

hash属性获取地址中的哈希值符号#后面部分

reload方法用来刷新当前页面传入参数true时表示强制刷新

localStorage作用是什么

可以将数据永久存储在本地用户的电脑除非手动删除否则关闭页面也存在

localStorage存储获取删除的语法是什么

存储localStorage.setItem(key,value)
获取localStorage.getItem(key)
删除localstorage.removeItem(key)

正则表达式是什么

是用于匹配字符串中字符组合的模式

正则表达式有什么作用

表单验证匹配
过滤敏感词替换
字符串中提取我们想要的部分提取

正则表达式使用分为几步

定义正则表达式
检测查找是否匹配

正则表达式检测查找 test方法和exec方法有什么区别

test方法用于判断是否有符合规则的字符串返回的是布尔值找到返回true否则返回false
exec方法用于检索查找符合规则的字符串找到返回数组否则为null

什么是元字符以及他的好处是什么

是一些具有特殊含义的字符可以极大提高了灵活性和强大的匹配功能
比如英文26个字母我们使用元字符a-z简洁和灵活

总结

+表示重复至少1次
表示重复0次或者1次
*表示重复0次或多次
{m,n}表示重复m到n次

字符类.(点)表示什么意思

匹配除了换行符之外的任何单个字符

字符类[]有若干代表什么意思

匹配除了[]里面的任何单个字符