收藏
天蓬老师批改状态：合格
老师批语：
箭头函数是用来简化匿名函数的语法糖
=> 胖箭头
-> 小箭头
// => 胖剪头// -> 小箭头let id = 'C888';let name = '电脑';let model = 'MacBook pro';let demo7 = (id, name, model) => [id, name, model];res = demo7(id, name, model);res.forEach(item => console.log(item));
在函数的参数中…rest是归并
在函数的调用的参数列表中就是…sprend展开
rest
function demo4(...arr) {console.log(arr);let res = 0;for (let v of arr) {res = res + v;}console.log(res);}demo4(1, 2, 3, 4, 5, 6, 7, 8, 9, 10);
sprend
function demo4(...arr) {console.log(arr);let res = 0;for (let v of arr) {res = res + v;}console.log(res);}let arr1 = [1, 2, 3, 4, 5, 6, 7, 8];//spreaddemo4(...arr1);
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>获取dom元素</title><style>.item:first-of-type {color: red;}</style></head><body><ul id="list"><li class="item">item1</li><li class="item">item2</li><li class="item">item3</li><li class="item">item4</li><li class="item">item5</li><li class="item">item6</li></ul><script>const li = document.querySelector('.item')console.log(li);</script>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>获取dom元素</title><style>.item:first-of-type {color: red;}</style></head><body><ul id="list"><li class="item">item1</li><li class="item">item2</li><li class="item">item3</li><li class="item">item4</li><li class="item">item5</li><li class="item">item6</li></ul><script>const lis = document.querySelectorAll('.item');// 将数组通过...sprend语法转为真正的数组let list = [...lis];console.log(list);</script></body></html>
classlist 专门用来操作类class
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>classlist对象</title><style>.red {color: red;}.blue {color: blue;}.bg {background-color: yellow;}</style></head><p class="red" id="hello">hello world</p><body><script>const p = document.querySelector('p');// 给p标签添加背景色p.classList.add('bg');// 将p标签的颜色字体红色替换为蓝色p.classList.replace('red', 'blue');</script></body></html>
dataset对象专用于访问自定义的标签属性
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>dataset对象</title></head><body><div class="user" data-email='12138@admin.com' data-my-gender="女">个人简介</div><script>const user = document.querySelector('.user');user.id = '12138';console.log(user.id);console.log(user.dataset.email);console.log(user.dataset.myGender);</script></body></html>
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
