vor 1 Jahr · 3e26b6982f
--- a/Bom/3_弹出框.html
+++ b/Bom/3_弹出框.html
@@ -0,0 +1,16 @@
 
				+<!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>
			
 
				+</head>
			
 
				+<body>
			
 
				+  <script>
			
 
				+    // alert('这是一个弹出框')//弹出消息对话框 只有一个确定的按钮
			
 
				+    // window.prompt('请输入内容',20)//对话框  有输入框 确定和按钮 能获取到输入框的内容
			
 
				+    confirm('123') //确定和取消的按钮
			
 
				+  </script>
			
 
				+</body>
			
 
				+</html>
			
--- a/Bom/4_history.html
+++ b/Bom/4_history.html
@@ -0,0 +1,20 @@
 
				+<!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>
			
 
				+</head>
			
 
				+<body>
			
 
				+  <h2>我是首页</h2>
			
 
				+  <a href="5_text.html">跳转到附页</a>
			
 
				+  <button id="btn">返回</button>
			
 
				+  <script>
			
 
				+    var btn = document.getElementById('btn')
			
 
				+    btn.onclick = function(){
			
 
				+      history.forward()
			
 
				+    }
			
 
				+  </script>
			
 
				+</body>
			
 
				+</html>
			
--- a/Bom/5_text.html
+++ b/Bom/5_text.html
@@ -0,0 +1,19 @@
 
				+<!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>
			
 
				+</head>
			
 
				+<body>
			
 
				+  <h2>我是附页</h2>
			
 
				+  <button id="btn">回到首页</button>
			
 
				+  <script>
			
 
				+    var btn = document.getElementById('btn')
			
 
				+    btn.onclick = function(){
			
 
				+      history.back()
			
 
				+    }
			
 
				+  </script>
			
 
				+</body>
			
 
				+</html>
			
--- a/Bom/6_location.html
+++ b/Bom/6_location.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>
			
 
				+</head>
			
 
				+
			
 
				+<body>
			
 
				+  <script>
			
 
				+    /*
			
 
				+    Location 对象的属性
			
 
				+    hash 设置或返回从井号 (#) 开始的 URL（锚）
			
 
				+    host 设置或返回主机名和当前 URL 的端口号
			
 
				+    hostname 设置或返回当前 URL 的主机名
			
 
				+    href 设置或返回完整的 URL
			
 
				+    pathname 设置或返回当前 URL 的路径部分
			
 
				+    port 设置或返回当前 URL 的端口号
			
 
				+    protocol 设置或返回当前 URL 的协议
			
 
				+    search 设置或返回从问号 (?) 开始的 URL（查询部分）
			
 
				+
			
 
				+    Navigator 对象的属性
			
 
				+
			
 
				+    appCodeName 返回浏览器的代码名
			
 
				+    appName 返回浏览器的名称
			
 
				+    appVersion 返回浏览器的平台和版本信息
			
 
				+    browserLanguage 返回当前浏览器的语言
			
 
				+    cookieEnabled 返回指明浏览器中是否启用 cookie 的布尔值
			
 
				+    cpuClass 返回浏览器系统的 CPU 等级
			
 
				+    onLine 返回指明系统是否处于脱机模式的布尔值
			
 
				+    platform 返回运行浏览器的操作系统平台
			
 
				+    systemLanguage 返回 OS 使用的默认语言
			
 
				+    userAgent 返回由客户机发送服务器的 user-agent 头部的值
			
 
				+    userLanguage 返回 OS 的自然语言设置
			
 
				+
			
 
				+    */
			
 
				+  </script>
			
 
				+</body>
			
 
				+
			
 
				+</html>
			
--- a/Dom/1_基础.html
+++ b/Dom/1_基础.html
@@ -0,0 +1,83 @@
 
				+<!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: red;
			
 
				+    }
			
 
				+
			
 
				+    #div2 {
			
 
				+      width: 200px;
			
 
				+      height: 200px;
			
 
				+      background: green;
			
 
				+    }
			
 
				+
			
 
				+    .xx {
			
 
				+      background: #818181;
			
 
				+    }
			
 
				+  </style>
			
 
				+</head>
			
 
				+
			
 
				+<body>
			
 
				+  <div id="div1">123</div>
			
 
				+  <div id="div2">222</div>
			
 
				+
			
 
				+  <div class="xx">333</div>
			
 
				+  <div>444</div>
			
 
				+  <div class="xx">555</div>
			
 
				+  <div>666</div>
			
 
				+
			
 
				+  <ul>
			
 
				+    <li class="xx">1</li>
			
 
				+    <li>2</li>
			
 
				+    <li class="xx">3</li>
			
 
				+    <li>4</li>
			
 
				+    <li class="xx">5</li>
			
 
				+    <li>6</li>
			
 
				+  </ul>
			
 
				+  <ul id="ul2">
			
 
				+    <li>1</li>
			
 
				+    <li class="xx">2</li>
			
 
				+    <li>3</li>
			
 
				+    <li class="xx">4</li>
			
 
				+    <li>5</li>
			
 
				+    <li class="xx">6</li>
			
 
				+  </ul>
			
 
				+
			
 
				+  <button id="btn">点击</button>
			
 
				+  <button id="btn1">click</button>
			
 
				+  <script>
			
 
				+    var div1 = document.getElementById('div1')
			
 
				+    var div2 = document.getElementById('div2')
			
 
				+    var xx = document.getElementsByClassName('xx')//返回的是一个数组
			
 
				+    var btn = document.getElementById('btn')
			
 
				+    var ul1 = document.getElementsByTagName('ul')//返回的是一个数组
			
 
				+    var ul2 = document.getElementById('ul2')
			
 
				+    var li = ul2.getElementsByClassName('xx')
			
 
				+    var btn1 = document.getElementById('btn1')
			
 
				+    btn.onclick = function () {
			
 
				+      div1.style.background = 'orange'
			
 
				+      for (var i = 0; i < xx.length; i++) {
			
 
				+        xx[i].style.background = 'green'
			
 
				+      }
			
 
				+    }
			
 
				+    console.log(ul1)
			
 
				+
			
 
				+    btn1.onclick = function () {
			
 
				+      for (var i = 0; i < li.length; i++) {
			
 
				+        li[i].style.background = 'orange'
			
 
				+      }
			
 
				+    }
			
 
				+
			
 
				+
			
 
				+  </script>
			
 
				+</body>
			
 
				+
			
 
				+</html>
			
--- a/Dom/2_demo.html
+++ b/Dom/2_demo.html
@@ -0,0 +1,32 @@
 
				+<!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: red;
			
 
				+      left: 100px;
			
 
				+      top: 50px;
			
 
				+      position: absolute;
			
 
				+    }
			
 
				+  </style>
			
 
				+</head>
			
 
				+<body>
			
 
				+  <div id="div1"></div>
			
 
				+  <button id="btn">点击</button>
			
 
				+  <script>
			
 
				+    var btn = document.getElementById('btn')
			
 
				+    var div1 = document.getElementById('div1')
			
 
				+    btn.onclick = function(){
			
 
				+      div1.style.background = 'aqua'
			
 
				+      div1.style.left = 300 + 'px'
			
 
				+      div1.style.top = '200px'
			
 
				+    }
			
 
				+  </script>
			
 
				+</body>
			
 
				+</html>