Web API第四天学习总结

数组和伪数组区别

1. 都可以使用for循环
2. 伪数组对于好用的数组方法不支持
   1. filter
   2. map
   3. some
   4. every
   5. find
   6. findIndex
   7. reduce
3. 使用document.querySelectorAll获取的数组是伪数组

创建文本节点

语法

document.createTextNode("文本的内容")

	let text1 = document.createTextNode(' • ');
        let text2 = document.createTextNode('人在学习');

克隆节点

1. 复制一个原有的节点
2. 把复制的节点放入指定的元素内部

语法

元素.cloneNode(布尔值)

cloneNode会克隆出一个跟原标签一样的元素，括号内传入布尔值

1. 当布尔值为true，则代表克隆时会包含后代节点一起克隆----深拷贝
2. 当布尔值为false，则代表克隆时不包含后代节点----浅拷贝
3. 默认为false

        // 1.获取需要克隆的元素
        let div = document.querySelector("div");
        // 2.克隆元素   
        // let newBox = div.cloneNode();//浅克隆，不能克隆元素里的子元素
        let newBox = div.cloneNode(true);//深克隆，可以克隆元素里的子元素
        // 3.插入body标签中
        document.body.appendChild(newBox);

删除节点

1. 页面不需要时可以删除
2. 在JS原生DOM操作中，要删除元素必须通过父元素

语法

父元素.removeChild(要删除的元素）

 <button>删除一个li</button>
    <ul>
        <li>1</li>
        <li>2</li>
        <li>3</li>
        <li>4</li>
        <li>5</li>
    </ul>
    <script>
        let btn = document.querySelector("button");
        let ul = document.querySelector("ul");
        
        btn.addEventListener("click",function() {
            // 1.要删除的子元素
            let li = document.querySelector("li:nth-child(1)");
            // 2.删除指定的元素
            ul.removeChild(li);

            // 删除自己
            // ul.remove();
        })
    </script>

注意

• 如果不存在父子关系则删除不成功
• 删除节点和隐藏节点是有区别的，一个只是隐藏了但是还是存在，一个是直接不存在了

时间对象

实例化对象

获得当前时间

let date = new Date();

获得指定时间

let date = new Date(1949-10-01);

时间方法

因为时间对象返回的数据我们不能直接使用，所以需要转换为实际开发中常用的格式

方法	作用	说明
getFullYear()	获得年份	获取四位年份
getMonth()	获得月份	取值为0~11
getDate()	获得月份中的每一天	不同月份取值也不同
getDay()	获取星期	取值为0~6
getHours()	获取小时	取值为0~23
getMinutes()	获取分钟	取值为0~59
getSeconds()	获取秒	取值为0~59

时间戳

指1970年01月01日00时00分00秒起至现在的毫秒数，它是一种特殊的计量时间的方式

三种获取时间戳的方式

1. 使用getTime()方法

   console.log(date.getTime());
   

2. 使用简写+ new Date()

   console.log(+(new Date()));//只有对象日期能用 + 将整个对象转成时间戳
   

3. 使用 Date.now()

   1. 无需实例化
   2. 只能得到当前的时间戳，前面两种可以返回指定的时间戳

   console.log(Date.now());