Inicio Explorar Ayuda
Iniciar sesión
lovecoding
/
vipAllDay
10
0
Fork 0
Archivos Incidencias 0 Pull Requests 0 Wiki
Explorar el Código

BOM

e hace 11 meses
padre
ddf273b5b7
commit
4b84bc6323
Se han modificado 8 ficheros con 208 adiciones y 0 borrados
Dividir vista Mostrar estadísticas de diff
  1. 15 0
      js/js初阶/BOM/3.window对象.html
  2. 25 0
      js/js初阶/BOM/4.history对象.html
  3. 25 0
      js/js初阶/BOM/5.Date对象.html
  4. 23 0
      js/js初阶/BOM/6.location对象.html
  5. 26 0
      js/js初阶/BOM/7.Navigator对象.html
  6. 55 0
      js/js初阶/BOM/8.获取元素.html
  7. 18 0
      js/js初阶/BOM/demo.html
  8. 21 0
      js/js初阶/BOM/index.html

+ 15 - 0
js/js初阶/BOM/3.window对象.html
Ver fichero 

@@ -0,0 +1,15 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+<head>
 
+    <meta charset="UTF-8">
 
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
+    <title>Document</title>
 
+</head>
 
+<body>
 
+    <script>
 
+        // window.alert 警告框
 
+        // window.prompt 输入框
 
+        // window.confirm 确认框
 
+    </script>
 
+</body>
 
+</html>

+ 25 - 0
js/js初阶/BOM/4.history对象.html
Ver fichero 

@@ -0,0 +1,25 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+<head>
 
+    <meta charset="UTF-8">
 
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
+    <title>Document</title>
 
+</head>
 
+<body>
 
+    <!-- 
+        history
 
+        forward 前进下一个页面
 
+        back 返回上一个页面
 
+        go 按级别跳转页面 允许负数
 
+     -->
 
+    <a href="./index.html">去另一个页面</a>
 
+    <button id="btn">跳转</button>
 
+    <script>
 
+        var btn = document.getElementById("btn");
 
+        btn.onclick = function() {
 
+            // history.forward()
 
+            history.go(1);
 
+        }
 
+    </script>
 
+</body>
 
+</html>

+ 25 - 0
js/js初阶/BOM/5.Date对象.html
Ver fichero 

@@ -0,0 +1,25 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+<head>
 
+    <meta charset="UTF-8">
 
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
+    <title>Document</title>
 
+</head>
 
+<body>
 
+    <script>
 
+     var date = new Date();
 
+     console.log(date.getDate()); //getDate 日期
 
+     console.log(date.getDay()); //getDay 星期
 
+     
+     console.log(date.getFullYear()); //getFullYear 年
 
+     console.log(date.getMonth() + 1); //getMonth 月 0-11
 
+     console.log(date.getHours()); //getHours 小时
 
+     console.log(date.getMinutes()); //getMinutes 分钟
 
+     console.log(date.getSeconds()); //getSeconds 秒
 
+     console.log(date.getTime()); //getTime 当前时间时间戳
 
+     console.log(date.getMilliseconds()) //getMilliseconds 当前毫秒
 
+     
+
 
+    </script>
 
+</body>
 
+</html>

+ 23 - 0
js/js初阶/BOM/6.location对象.html
Ver fichero 

@@ -0,0 +1,23 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+  <head>
 
+    <meta charset="UTF-8" />
 
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
 
+    <title>Document</title>
 
+  </head>
 
+  <body>
 
+    <!-- 
+        hash 设置或返回从井号 (#) 开始的 URL（锚）
 
+        host 设置或返回主机名和当前 URL 的端口号
 
+        hostname 设置或返回当前 URL 的主机名
 
+        href 设置或返回完整的 URL
 
+        pathname 设置或返回当前 URL 的路径部分
 
+        port 设置或返回当前 URL 的端口号
 
+        protocol 设置或返回当前 URL 的协议
 
+        search 设置或返回从问号 (?) 开始的 URL（查询部分）
 
+     -->
 
+     <script>
 
+        console.log(location)
 
+     </script>
 
+  </body>
 
+</html>

+ 26 - 0
js/js初阶/BOM/7.Navigator对象.html
Ver fichero 

@@ -0,0 +1,26 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+<head>
 
+    <meta charset="UTF-8">
 
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
+    <title>Document</title>
 
+</head>
 
+<body>
 
+    <!-- 
+        appCodeName 返回浏览器的代码名
 
+        appName 返回浏览器的名称
 
+        appVersion 返回浏览器的平台和版本信息
 
+        browserLanguage 返回当前浏览器的语言
 
+        cookieEnabled 返回指明浏览器中是否启用 cookie 的布尔值
 
+        cpuClass 返回浏览器系统的 CPU 等级
 
+        onLine 返回指明系统是否处于脱机模式的布尔值
 
+        platform 返回运行浏览器的操作系统平台
 
+        systemLanguage 返回 OS 使用的默认语言
 
+        userAgent 返回由客户机发送服务器的 user-agent 头部的值
 
+        userLanguage 返回 OS 的自然语言设置
 
+     -->
 
+     <script>
 
+        console.log(navigator)
 
+     </script>
 
+</body>
 
+</html>

+ 55 - 0
js/js初阶/BOM/8.获取元素.html
Ver fichero 

@@ -0,0 +1,55 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+<head>
 
+    <meta charset="UTF-8">
 
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
+    <title>Document</title>
 
+</head>
 
+<body>
 
+    <div id="box">111</div>
 
+    <div class="box1">222</div>
 
+    <button>我是一个按钮</button>
 
+    <ul>
 
+        <li id="aaa">1234567</li>
 
+        <li id="aaa">1234567</li>
 
+        <li id="aaa">1234567</li>
 
+        <li id="aaa">1234567</li>
 
+        <li id="aaa">1234567</li>
 
+        <li id="aaa">1234567</li>
 
+        <li id="aaa">1234567</li>
 
+    </ul>
 
+    <h3 class="hh">我的</h3>
 
+    <span></span>
 
+    <!-- 
+        元素
 
+            getElementById
 
+            querySelector
 
+        数组（伪数组）
 
+            getElementsByClassName
 
+            getElementsByTagName
 
+            querySelectorAll
 
+     -->
 
+    <script>
 
+        // 1.获取id选择器  document.getElementById
 
+        var box = document.getElementById("box");
 
+        console.log(box)
 
+        // 2.获取类选择器  document.getElementsByClassName
 
+        var box1 = document.getElementsByClassName("box1");
 
+        console.log(box1[0].innerText,'类');
 
+        // 3.获取标签选择器 document.getElementsByTagName
 
+        var btn = document.getElementsByTagName("button");
 
+        console.log(btn);
 
+        // 4.通过css样式选择器获取全部标签 document.querySelectorAll
 
+        var lis = document.querySelectorAll("ul li");
 
+        console.log(lis);
 
+        // 5.通过css样式选择器获取当前标签 document.querySelector
 
+        var h3 = document.querySelector(".hh");
 
+        console.log(h3);
 
+        var span = document.querySelector("span");
 
+        // var span = document.getElementsByTagName("span");
 
+        console.log(span)
 
+        span.innerText = '啊哈哈哈'
 
+        // innerHTML innerText 区别
 
+    </script>
 
+</body>
 
+</html>

+ 18 - 0
js/js初阶/BOM/demo.html
Ver fichero 

@@ -0,0 +1,18 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+<head>
 
+    <meta charset="UTF-8">
 
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
+    <title>Document</title>
 
+</head>
 
+<body>
 
+    <h1>demo</h1>
 
+    <button id="ha">回主页</button>
 
+    <script>
 
+        var ha = document.getElementById("ha");
 
+        ha.onclick = function() {
 
+            history.go(-2)
 
+        }
 
+    </script>
 
+</body>
 
+</html>

+ 21 - 0
js/js初阶/BOM/index.html
Ver fichero 

@@ -0,0 +1,21 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+<head>
 
+    <meta charset="UTF-8">
 
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
+    <title>Document</title>
 
+</head>
 
+<body>
 
+    <h1>哈哈哈</h1>
 
+    <button id="btn">回去</button>
 
+    <a href="./demo.html">去demo</a>
 
+    <!-- <button id="btn1">下一个</button> -->
 
+    <script>
 
+        var btn = document.getElementById("btn");
 
+        btn.onclick =  function() {
 
+            // history.back();
 
+            history.go(-1);
 
+        }
 
+    </script>
 
+</body>
 
+</html>