一、知识总结

1.css定位

定位( position )允许您从正常的文档流布局中取出元素，并使它们具有不同的行为，例如放在另一个
元素的上面，或者始终保持在浏览器视窗内的同一位置。
有许多不同类型的定位，您可以对HTML元素生效。

1.1 静态定位

静态( staitc )定位是每个元素获取的默认值——它只是意味着“将元素放入它在文档布局流中的正常位
置 ——这没有什么特别的。
如果所有的父元素都没有显式地定义 position 属性，那么所有的父元素默认情况下 position 属性都
是 static 。

1.2 相对定位

相对定位与静态定位非常相似，占据在正常的文档流中，除了你仍然可以修改它的最终位置，包括让它
与页面上的其他元素重叠。
给元素加上 position:relative; 并不会改变元素的位置，需要使用 top ， bottom ， left 和 right
属性。
相对定位生成相对定位的元素，相对于其正常位置进行定位

1.3 绝对定位

position:absolute; 生成绝对定位的元素，相对于static定位以外的第一个父元素进行定位。绝对定
位的元素不再存在于正常文档布局流中。
3.3.4 固定定位
fixed 固定定位，这与绝对定位的工作方式完全相同，只有一个主要区别：绝对定位固定元素是相对于
元素或其最近的定位祖先，而固定定位固定元素则是相对于浏览器视口本身。

2. z-index

当我们使用定位后，元素有可能会出现重叠现象。什么决定哪些元素出现在其他元素的顶部？当我们在
定位上下文中只有一个定位的元素，它出现在顶部，因为定位的元素胜过未定位的元素。如果是多个定
位元素，在后面的定位元素将出现在先定位与元素的顶部。
当然，我们可以使用 z-index 属性。 “z-index”是对z轴的参考。
网页也有一个z轴：一条从屏幕表面到你的脸（或者在屏幕前面你喜欢的任何其他东西）的虚线。 zindex 值影响定位元素位于该轴上的位置；正值将它们移动到堆栈上方，负值将它们向下移动到堆栈
中。默认情况下，定位的元素都具有z-index为auto，实际上为0。

3. position: sticky

还有一个可用的位置值称为 position: sticky，比起其他位置值要新一些。它基本上是相对位置和固定位
置的混合体，它允许被定位的元素表现得像相对定位一样，直到它滚动到某个阈值点（例如，从视口顶
部起10像素）为止，此后它就变得固定了。

4.JavaScript

文档对象模型针对的是一份文档，加上各个浏览器渲染Web页面的具体方法略有不同，那么相同的一份代码在不同的浏览器中便会有冲突不断。为了让DOM更具标准化，DOM也被纳入W3C标准。在W3C的标准中，DOM是独立于平台和语言的一种接口，它允许程序和脚本动态的访问更新文档的结构、样式和内容。

5.querySelector和querySelectorAll()

querySelector() 方法仅仅返回匹配指定选择器的第一个元素。如果你需要返回所有的元素，请使用 querySelectorAll() 方法替代

6.querySelector系列和getElementById

6.1.区别

1、两者的W3C标准不同
querySelector系列属于W3C中的Selectors API(JS)规范
getElementsBy系列则属于 W3C的DOM 规范。
2、两者浏览器的兼容不同
getElementsBy系列基本能被所有浏览器支持。
querySelector系列则通常只有在考虑兼容性的时候才被提起(尽管两者功能近似)

3、接受参数不同
querySelector系列接收的参数是一个css选择器名。
getElementsBy系列接收的参数只能是单一的className、tagName 和 name。

4、返回值不同
querySelector系列返回的是静态节点列表
getElementsBy系列返回的是动态节点列表

7.Date函数的使用

在JavaScript中，Date对象用于处理日期和时间。常见创建Date对象的方式有两种：

7.1 创建不带参数的Date对象

var d=new Date();

7.2 创建一个指定日期的Date对象

var d=new Date(2021,1);

8.innerText和innerHTML

innerText主要是设置文本的，甚至标签内容，是没有标签的效果的。

innerHTML主要的作用是在标签中设置新的heml标签内容，是有标签效果的.

二、心得体会

​ 在今天的学习中，学习了JavaScript的一些知识，包括函数的使用，我发现我不能很好的去运用，之前在学校的课程中，老师也没有系统全面的去讲过，也只是过了一遍，我发现我对JavaScript还有很大的问题，我还需要更认真的去学。