js易混淆题目总结笔记

1.innerHTML普通元素内容,里面的标签正常输出，不会自动对文本进行编码和解码。

innerText纯文本内容

jQuery：

        html()

        text()

        val()

2.jQuery下的：

        remove()

        该方法不会把匹配的元素从 jQuery 对象中删除，因而可以在将来再使用这些匹配的元素。
　　但除了这个元素本身得以保留之外，remove() 不会保留元素的 jQuery 数据。其他的比如绑定的事件、附加的数据等都会被移除。这一点与 detach() 不同。

        empty()

拿$("p").empty()来说，他只是把<p>dsfsd</p>中的文本给移除了，而留下 了<p></p>,仍保留其在dom中所占的位置。
$("p").remove()则是把其从dom中删除，而不会保留其所占的位置。

3.em 与rem的区别？

em先根据自己的font-size值设置 再是继承有font-size大小的父元素 最后再是找根元素 也就是html标签的font-size

rem相对于浏览器的font-size大小，也就是html标签的font-size大小

4.js数组中哪些方法是在原值上进行的修改？哪些方法没有对原值进行修改？

       在原值上修改的：

        1.push()
        向数组的末尾添加一个或多个元素，并返回新的长度。

        2.pop()删除数组的最后一个元素并返回删除的元素。

        3.shift()
        把数组的第一个元素从其中删除，并返回第一个元素的值

        4.unshift()向数组的开头添加一个或更多元素，并返回新的长度。

        5.splice()
        向/从数组中添加/删除元素，然后返回被删除的元素。

        6.sort()对数组的元素进行排序。

        7.reverse()
        用于颠倒数组中元素的顺序。

        没有对原值进行修改：

        1.indexOf()
        返回数组中某个指定的元素位置。

        2.lastIndexOf()
        返回一个指定的元素在数组中最后出现的位置，从该字符串的后面向前查找。

        3.concat()
        连接两个或多个数组。

        4.slice()
        从已有的数组中返回选定的元素。

        5.join()把数组中的所有元素放入一个字符串。元素是通过指定的分隔符进行分隔的。

        6.forEach（）
        调用数组的每个元素，并将元素传递给回调函数。

        7.every()
        检测数组所有元素是否都符合指定条件（通过函数提供）。

        8.some()
        检测数组中的元素是否满足指定条件（函数提供）。

        9.filter()
        创建一个新的数组，新数组中的元素是通过检查指定数组中符合条件的所有元素。

        10.map()
        返回一个新数组，数组中的元素为原始数组元素调用函数处理后的值。

5.hr是块级标签，横线，br是行内标签，换行

6.水平居中的方法

        1.文字（单行或多行）

        text-align：center；

        2.div居中

        margin：0 auto；

        父元素：display:flex;flex-direction:column;子元素：align-self:center;

        父元素：display:flex;flex-direction:row;justify-content:center;

        父元素：display:flex;flex-direction:column;align-items:center；

        子元素：margin-left：父元素宽度的一半-子元素宽度的一半；

        3.当div的宽度不确定时

        width:fit-content;margin:0 auto;div就会水平居中，text-align：center;里面的文本会居中

7、请写出让元素垂直居中的多种布局方法？

        CSS的三大特性是继承、层叠、优先级

        1.单行文本垂直居中：我们只需要设置它的实际高度height和所在行的高度line-height相等即可。文字默认在这一行中是垂直居中的

        2.（未知高度）多行文本垂直居中设置上下的padding值一样即可

        3.多行文本固定高度的居中（模拟table方法）

        display:table和display:table-cell的使用方法，前者必须设置在父元素上，后者必须设置在子元素上

        vertical-align:middle属性可以放在父元素或者子元素上

        4.使用定位的方式position，让其距离顶部高度为50%，然后设置margin-top：-(盒子高度/2)px即可

        5.图片 ：display:table-cell；vertical-align: middle;

                        background: url(wgs.jpg) no-repeat center center;

        6.div居中

                父元素：display：flex；flex-direction:row;子元素：align-self：center；

        7.div居中

                父元素：display：flex；flex-direction：row；align-items:center;

                父元素：display：flex；flex-direction：column；justify-cotent:center;