zsydgithub 1 anno fa
parent
commit
c8877031f5
2 ha cambiato i file con 92 aggiunte e 0 eliminazioni
  1. 42 0
      es6/10_练习2.html
  2. 50 0
      es6/9_练习.html

+ 42 - 0
es6/10_练习2.html

@@ -0,0 +1,42 @@
+<!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>Document</title>
+  <style>
+    #container {
+      display: flex;
+    }
+
+    .div1 {
+      width: 100px;
+      height: 50px;
+      border: 1px solid #ccc;
+      margin-right: 20px;
+    }
+  </style>
+</head>
+
+<body>
+  <div id="container">
+    <div class="div1">1</div>
+    <div class="div1">2</div>
+    <div class="div1">3</div>
+  </div>
+  <script>
+    var items = document.getElementsByClassName('div1')
+    for (let  i = 0; i < items.length; i++) {
+      console.log(items[i])
+      items[i].onclick = function(){
+        // this.style.background = 'orange'
+        items[i].style.background = 'orange'
+        
+      }
+    }
+  </script>
+</body>
+
+</html>

+ 50 - 0
es6/9_练习.html

@@ -0,0 +1,50 @@
+<!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>Document</title>
+  <style>
+    #div1 {
+      width: 200px;
+      height: 200px;
+      background: orange;
+    }
+  </style>
+</head>
+
+<body>
+  <div id="div1"></div>
+  <script>
+    //需求 点击div 2s延迟时间  然后变为粉色
+    /* var div1 = document.getElementById('div1')
+    div1.onclick = function(){
+      //保存this的值
+      // let _this = this
+      // setTimeout(function(){
+      //   _this.style.background = 'pink'
+      // },2000)
+
+      setTimeout(()=>{
+        this.style.background = 'pink'
+      },2000)
+    } */
+
+    //需求2  从给定的数组里面返回偶数的元素
+    // const arr = [1, 6, 7, 10, 100, 25]
+    // // const result = arr.filter(function(item){
+    // //   if(item % 2 ==0){
+    // //     return true
+    // //   } else {
+    // //     return false
+    // //   }
+    // // })
+
+    // const result = arr.filter(item => item % 2 == 0)
+    // console.log(result)
+  </script>
+</body>
+
+</html>