diff --git "a/08 \345\256\230\346\226\207\350\257\232/20231108 Dom.md" "b/08 \345\256\230\346\226\207\350\257\232/20231108 Dom.md"
new file mode 100644
index 0000000000000000000000000000000000000000..5939fe62c4bfe02793a4ff731868377a7d9a134e
--- /dev/null
+++ "b/08 \345\256\230\346\226\207\350\257\232/20231108 Dom.md"	
@@ -0,0 +1,215 @@
+### 笔记
+
+#### 获取Dom对象
+
+document.属性
+
+queryselector :满足条件的第一个元素
+
+queryselectorAll: 满足条件的元素集合（节点集合是一个为数组）
+
+#### 修改文字内容 innerHtml
+
+对象.innerHtml=属性
+
+#### 修改图片对象的属性
+
+img.src='值' 更改图片
+
+img.title='值' 照片提示
+
+img.alt='值' 照片报错提示
+
+#### 取到N-M的随机整数
+
+Mach.flooc(Mach.random()*(m-n+1)+n)
+
+#### 修改样式属性
+
+对象.style.样式属性=’值‘
+
+#### 追加类
+
+add()
+
+#### 删除类
+
+remove()
+
+#### 切换类
+
+toggle()
+
+ul li:child()
+
+### 作业
+
+```js
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <meta charset="UTF-8" />
+  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+  <title>轮播图点击切换</title>
+  <style>
+    * {
+      box-sizing: border-box;
+    }
+
+    .slider {
+      width: 560px;
+      height: 400px;
+      overflow: hidden;
+    }
+
+    .slider-wrapper {
+      width: 100%;
+      height: 320px;
+    }
+
+    .slider-wrapper img {
+      width: 100%;
+      height: 100%;
+      display: block;
+    }
+
+    .slider-footer {
+      height: 80px;
+      background-color: rgb(100, 67, 68);
+      padding: 12px 12px 0 12px;
+      position: relative;
+    }
+
+    .slider-footer .toggle {
+      position: absolute;
+      right: 0;
+      top: 12px;
+      display: flex;
+    }
+
+    .slider-footer .toggle button {
+      margin-right: 12px;
+      width: 28px;
+      height: 28px;
+      appearance: none;
+      border: none;
+      background: rgba(255, 255, 255, 0.1);
+      color: #fff;
+      border-radius: 4px;
+      cursor: pointer;
+    }
+
+    .slider-footer .toggle button:hover {
+      background: rgba(255, 255, 255, 0.2);
+    }
+
+    .slider-footer p {
+      margin: 0;
+      color: #fff;
+      font-size: 18px;
+      margin-bottom: 10px;
+    }
+
+    .slider-indicator {
+      margin: 0;
+      padding: 0;
+      list-style: none;
+      display: flex;
+      align-items: center;
+    }
+
+    .slider-indicator li {
+      width: 8px;
+      height: 8px;
+      margin: 4px;
+      border-radius: 50%;
+      background: #fff;
+      opacity: 0.4;
+      cursor: pointer;
+    }
+
+    .slider-indicator li.active {
+      width: 12px;
+      height: 12px;
+      opacity: 1;
+    }
+  </style>
+</head>
+
+<body>
+  <div class="slider">
+    <div class="slider-wrapper">
+      <img src="./images/slider01.jpg" alt="" />
+    </div>
+    <div class="slider-footer">
+      <p>对人类来说会不会太超前了？</p>
+      <ul class="slider-indicator">
+        <li></li>
+        <li></li>
+        <li></li>
+        <li></li>
+        <li></li>
+        <li></li>
+        <li></li>
+        <li></li>
+      </ul>
+      <div class="toggle">
+        <button class="prev">&lt;</button>
+        <button class="next">&gt;</button>
+      </div>
+    </div>
+  </div>
+  <script>
+    // const arr = [1, 3]
+    // arr[0]
+    // 1. 初始数据
+    const sliderData = [
+      { url: './images/slider01.jpg', title: '对人类来说会不会太超前了？', color: 'rgb(100, 67, 68)' },
+      { url: './images/slider02.jpg', title: '开启剑与雪的黑暗传说！', color: 'rgb(43, 35, 26)' },
+      { url: './images/slider03.jpg', title: '真正的jo厨出现了！', color: 'rgb(36, 31, 33)' },
+      { url: './images/slider04.jpg', title: '李玉刚：让世界通过B站看到东方大国文化', color: 'rgb(139, 98, 66)' },
+      { url: './images/slider05.jpg', title: '快来分享你的寒假日常吧~', color: 'rgb(67, 90, 92)' },
+      { url: './images/slider06.jpg', title: '哔哩哔哩小年YEAH', color: 'rgb(166, 131, 143)' },
+      { url: './images/slider07.jpg', title: '一站式解决你的电脑配置问题！！！', color: 'rgb(53, 29, 25)' },
+      { url: './images/slider08.jpg', title: '谁不想和小猫咪贴贴呢！', color: 'rgb(99, 72, 114)' },
+    ]
+
+
+
+
+    // 1. 需要一个随机数 
+    let i=Math.floor(Math.random()*sliderData.length)
+
+    // console.log(sliderData[i]);
+   
+    // 2. 把对应的数据渲染到标签里面
+      // 2.1 获取图片
+      let img =document.querySelector('.slider-wrapper img')
+        // 2.2. 修改图片路径  =  对象.url
+        img.src=sliderData[i].url;
+    // 3. 把p里面的文字内容更换
+      // 3.1 获取p
+      let p =document.querySelector('.slider-footer p')
+      // 3.2修改p
+      p.innerHTML=sliderData[i].title
+      // 4. 修改背景颜色
+      let footer=document.querySelector('.slider-footer')
+      footer.style.backgroundColor=sliderData[i].color
+
+    // 5. 小圆点 
+    let li =document.querySelector(`.slider-indicator li:nth-child(${i+1})`)
+    
+
+     
+    // 让当前这个小li 添加 active这个类
+
+		li.ClassName='active'
+
+  </script>
+</body>
+
+</html>
+```
+
