JS基础问题归纳（一）

一、声明变量

1. 以后声明变量我们优先使用哪个？

const。

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

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

因为对象时引用类型，里面存储的是地址，只要地址不变，就不会报错。

建议数组和对象使用 const 来声明。

3. 什么时候使用let声明变量？

如果基本数据类型的值或者应用类型的地址发生变化的时候，需要用let。

比如 一个变量进行加减运算，比如 for 循环中的 i++。

二、DOM树和DOM对象

1. API作用和分类

作用：就是使用JS去操作html和浏览器

分类：DOM(文档对象模型)、BOM(浏览器对象模型)

JavaScript 分为 ECMAScript和Web APIs ，而Web APIs还分为DOM和BOM

2. 什么是 DOM？

DOM(Document Object Model——文档对象模型)是用来呈现以及与任意HTML或XML文档交互的API。

白话文：DOM是浏览器提供的一套专门用来 操作网页内容 的功能

DOM作用：开发网页内容特效和实现用户交互

3. DOM树是什么？

将HTML文档以树状结构直观的表现出来，我们称之为文档树或DOM树

是描述网页内容关系的名词

作用：文档树直观的体现了标签和标签之间的关系

4. DOM对象是什么？

浏览器根据html标签生成的JS对象，所有的标签属性都可以在这个对象上面找到，修改这个对象的属性会自动映射到标签身上。

DOM的核心思想：把网页内容当作 对象 来处理

document 对象：是DOM里提供的一个对象，所以它提供的属性和方法都是用来访问和操作网页内容的，例：document.write()，网页所有内容都在document里面

三、获取DOM元素

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

querySelectorAll()、querySelector()

2. 他们两者的区别是什么？

querySelect() 只能选择一个元素，可以直接操作

querySelectorAll() 可以选择多个元素，得到的是伪数组，需要遍历得到每一个元素

3. 他们两者小括号里面的参数有什么注意事项？

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

四、DOM修改元素

1. DOM如何修改元素的文本内容

①对象.innerText属性   不解析标签

        将文本内容添加/更新到任意标签位置

        显示纯文本，不解析标签

②对象.innerHTML属性   解析标签

        将文本内容添加/更新到任意标签位置

        会解析标签，多标签建议使用模板字符

2. 操作元素常用属性

还可以通过JS设置/修改标签元素属性，比如通过 src更换 图片

最常见的属性比如：href、title、src等

语法：对象.属性 = 值

3. 修改样式属性

①通过style修改样式属性。对象.style.样式 = 值

②通过className修改样式。元素.className = 'active'  其中active是一个类名

注意：由于class是关键字，所以使用className去替代

className是使用新值换旧值，如果需要添加一个类，需要保留之前的类名

③通过classList修改样式。

追加一个类   元素.classList.add('类名')

删除一个类   元素.classList.remove('类名')

切换一个类   元素.classList.toggle('类名')

4. 使用className和classList的区别

className修改大量样式的时候更方便

classList修改不多样式的时候方便

classList是追加和删除不影响以前类名

5. 如何获取和设置表单的值

获取: DOM对象.属性名

设置: DOM对象.属性名 = 新值

表单属性中添加就有效果，移除就没有效果，一律使用布尔值表示。如果为true，代表添加了该属性；如果是false，代表移除了该属性。比如： disabled 、 checked 、 selected

6. 什么是H5自定义属性？

标准属性： 标签天生自带的属性 比如class id title等，可以直接使用点语法操作比如：disabled、checked、selected

自定义属性：在html5中推出来了专门的data-自定义属性，在标签上一律以data-开头，在DOM对象上一律以dataset对象方式获取