'更新了爬虫部分的代码'

zwfcrazy · Jul 23, 2018 · e2a7bbd · e2a7bbd
1 parent 02918d5
commit e2a7bbd
Show file tree

Hide file tree

Showing 34 changed files with 1,084 additions and 77 deletions.
diff --git a/Day21-30/code/web1804/.project b/Day21-30/code/web1804/.project
@@ -0,0 +1,37 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<projectDescription>
+	<name>web1804</name>
+	<comment>Create By HBuilder</comment>
+	<projects>
+	</projects>
+	<buildSpec>
+		<buildCommand>
+			<name>com.aptana.ide.core.unifiedBuilder</name>
+			<arguments>
+			</arguments>
+		</buildCommand>
+	</buildSpec>
+	<natures>
+		<nature>com.aptana.projects.webnature</nature>
+	</natures>
+	<filteredResources>
+		<filter>
+			<id>1531706375771</id>
+			<name></name>
+			<type>10</type>
+			<matcher>
+				<id>org.eclipse.ui.ide.orFilterMatcher</id>
+				<arguments>
+					<matcher>
+						<id>org.eclipse.ui.ide.multiFilter</id>
+						<arguments>1.0-projectRelativePath-matches-false-false-bin</arguments>
+					</matcher>
+					<matcher>
+						<id>org.eclipse.ui.ide.multiFilter</id>
+						<arguments>1.0-projectRelativePath-matches-false-false-setting</arguments>
+					</matcher>
+				</arguments>
+			</matcher>
+		</filter>
+	</filteredResources>
+</projectDescription>
diff --git a/Day21-30/code/web1804/example01.html b/Day21-30/code/web1804/example01.html
@@ -0,0 +1,34 @@
+<!DOCTYPE html>
+<html>
+	<head>
+		<meta charset="UTF-8">
+		<title></title>
+	</head>
+	<body>
+		<script>
+			/*
+			var sum = 0;
+			for (var i = 1; i <= 100; i += 1) {
+				sum += i;
+			}
+			window.alert(sum);
+			*/
+			/*
+			var sum = 0;
+			var i = 1;
+			while (i <= 100) {
+				sum += i;
+				i += 1;
+			}
+			window.alert(sum);
+			*/
+			var sum = 0;
+			var i = 1;
+			do {
+				sum += i;
+				i += 1;
+			} while (i <= 100);
+			window.alert(sum);
+		</script>
+	</body>
+</html>
diff --git a/Day21-30/code/web1804/example02.html b/Day21-30/code/web1804/example02.html
@@ -0,0 +1,53 @@
+<!DOCTYPE html>
+<html>
+	<head>
+		<meta charset="UTF-8">
+		<title></title>
+		<style>
+			.right {
+				float: right;
+				width: 250px;
+				height: 30px;
+				font-size: 16px;
+				line-height: 30px;
+				background-color: blue;
+				color: yellow;
+				text-align: center;
+			}
+		</style>
+	</head>
+	<body>
+		<div id="time" class="right"></div>
+		<script>
+			function showDateTime() {
+				var array = ["日", "一", "二", "三", "四", "五", "六"];
+				var date = new Date();
+				var str = "";
+				str += date.getFullYear() + "年"; // 年
+				str += (date.getMonth() + 1) + "月"; // 月(0-11)
+				str += date.getDate() + "日&nbsp;&nbsp;"; // 日
+				str += "星期" + array[date.getDay()] + "&nbsp;&nbsp;"; // 星期(0-6)
+				var hour = date.getHours();
+				str += hour < 10 ? "0" + hour : hour; // 时
+				str += ":";
+				var min = date.getMinutes();
+				str += min < 10 ? "0" + min : min; // 分
+				str += ":";
+				var sec = date.getSeconds();
+				str += sec < 10 ? "0" + sec : sec; // 秒
+				// JavaScript = ECMAScript + BOM(window) + DOM(document)
+				// document对象(DOM)代表整个HTML页面
+				// 通过该对象的getElementById方法可以用ID来获取指定的元素(标签)
+				// 通过获得的元素的textContent属性就可以修改标签体的文本内容
+				var div = document.getElementById("time");
+				// 如果放入元素中的内容又包含了标签或实体替换符(字符实体)
+				// 那么就要将textContent属性换成innerHTML才能渲染标签和字符实体
+				div.innerHTML = str;
+			}
+			showDateTime();
+			// window对象(BOM)代表浏览器窗口
+			// 通过该对象的setInterval方法可以设置计时器控制函数周期性执行
+			setInterval(showDateTime, 1000);
+		</script>
+	</body>
+</html>
diff --git a/Day21-30/code/web1804/example03.html b/Day21-30/code/web1804/example03.html
@@ -0,0 +1,31 @@
+<!DOCTYPE html>
+<html>
+	<head>
+		<meta charset="UTF-8">
+		<title></title>
+	</head>
+	<body>
+		<script>
+			do {
+				var answer = parseInt(Math.random() * 100 + 1);
+				var total = 0;
+				do {
+					total += 1;
+					var thyAnswer = parseInt(prompt("请输入:"));
+					if (thyAnswer > answer) {
+						alert("小一点");
+					} else if (thyAnswer < answer) {
+						alert("大一点");
+					} else if (thyAnswer == answer) {
+						alert("恭喜你猜对了");
+					} else {
+						alert("你是猴子派来的逗比吗?");
+					}
+				} while (thyAnswer != answer);
+				if (total > 7) {
+					alert("智商捉急!!!");
+				}
+			} while (confirm('再来一局?'));
+		</script>
+	</body>
+</html>
diff --git a/Day21-30/code/web1804/example04.html b/Day21-30/code/web1804/example04.html
@@ -0,0 +1,25 @@
+<!DOCTYPE html>
+<html>
+	<head>
+		<meta charset="UTF-8">
+		<title></title>
+	</head>
+	<body>
+		<h3><span id="counter">5</span>秒钟以后跳转到百度</h3>
+		<script>
+		+function() {	
+			var counter = 5;
+			var span = document.getElementById("counter");
+			setTimeout(function() {
+				counter -= 1;
+				if (counter > 0) {
+					span.textContent = counter;
+					setTimeout(arguments.callee, 1000);
+				} else {
+					location.href = "http://www.baidu.com";
+				}
+			}, 1000);
+		}();
+		</script>
+	</body>
+</html>
diff --git a/Day21-30/code/web1804/example05.html b/Day21-30/code/web1804/example05.html
@@ -0,0 +1,87 @@
+<!DOCTYPE html>
+<html>
+	<head>
+		<meta charset="UTF-8">
+		<title></title>
+		<style>
+			* {
+				margin: 0;
+				padding: 0;
+			}
+			#adv {
+				width: 940px;
+				margin: 0 auto;
+			}
+			#adv ul {
+				width: 120px;
+				height: 30px;
+				margin: 0 auto;
+				position: relative;
+				top: -30px;
+			}
+			#adv li {
+				width: 30px;
+				height: 30px;
+				list-style: none;
+				float: left;
+				color: #ccc;
+				cursor: pointer;
+			}
+		</style>
+	</head>
+	<body>
+		<div id="adv">
+			<img id="image" src="img/slide-1.jpg" alt="">
+			<ul>
+				<li class="dot">●</li>
+				<li class="dot">●</li>
+				<li class="dot">●</li>
+				<li class="dot">●</li>
+			</ul>
+		</div>
+		<script src="js/common.js"></script>
+		<script>
+		(function() {
+			var index = 1;
+			var img = document.getElementById("image");
+			var timerId = 0;
+
+			function startTimer() {
+				if (timerId == 0) {
+					timerId = setInterval(function() {
+						index += 1;
+						if (index > 4) {
+							index = 1;
+						}
+						img.src = "img/slide-" + index + ".jpg";
+					}, 2000);
+				}
+			}
+
+			startTimer();
+			// 通过document对象获取页面上的元素(标签)有以下方法:
+			// 1. document.getElementById("...")
+			// 2. document.getElementsByTagName("...")
+			// 3. document.getElementsByClassName("...")
+			// 4. document.getElementsByName("...")
+			// 5. document.querySelector("...")
+			// 6. document.querySelectorAll("...")
+			var liList = document.querySelectorAll("#adv .dot");
+			for (var i = 0; i < liList.length; i += 1) {
+				liList[i].index = i + 1;
+				bind(liList[i], "click", function(evt) {
+					evt = evt || event;
+					var target = evt.target || evt.srcElement;
+					index = target.index;
+					img.src = "img/slide-" + index + ".jpg";
+					clearInterval(timerId);
+					timerId = 0;
+				});
+				bind(liList[i], "mouseout", function(evt) {
+					startTimer();
+				});
+			}
+		})();
+		</script>
+	</body>
+</html>
diff --git a/Day21-30/code/web1804/example06.html b/Day21-30/code/web1804/example06.html
@@ -0,0 +1,43 @@
+<!DOCTYPE html>
+<html>
+	<head>
+		<meta charset="UTF-8">
+		<title></title>
+	</head>
+	<body>
+		<button id="ok">确定</button>
+		<!--如果希望点击按钮时会执行对应的操作-->
+		<!--那么需要通过JavaScript为按钮绑定事件回调函数-->
+		<!--绑定事件回调函数大致有3种方式: -->
+		<!--1. 通过标签的onXXX属性来指定需要执行的事件回调函数-->
+		<!--2. 通过元素的onXXX属性来绑定需要执行的事件回调函数-->
+		<!--3. 通过元素的addEventListener方法来绑定事件回调函数-->
+		<script>
+			var btn = document.getElementById("ok");
+			function sayHello() {
+				alert("大家好!");
+			}
+			function sayGoodbye() {
+				alert("再见!");
+			}
+			// Netscape Navigator --> Firefox
+			// Internet Explorer
+			// Chrome
+			// Safari
+			// Opera
+			if (btn.addEventListener) {
+				btn.addEventListener("click", sayHello);
+				btn.addEventListener("click", sayGoodbye);
+				btn.addEventListener("click", function() {
+					btn.removeEventListener("click", sayGoodbye);
+				});
+			} else {
+				btn.attachEvent("onclick", sayHello);
+				btn.attachEvent("onclick", sayGoodbye);
+				btn.attachEvent("onclick", function() {
+					btn.detachEvent("onclick", sayGoodbye);
+				});
+			}
+		</script>
+	</body>
+</html>
diff --git a/Day21-30/code/web1804/example07.html b/Day21-30/code/web1804/example07.html
@@ -0,0 +1,61 @@
+<!DOCTYPE html>
+<html>
+	<head>
+		<meta charset="UTF-8">
+		<title></title>
+		<style>
+			* {
+				margin: 0;
+				padding: 0;
+			}
+			#container {
+				margin: 10px 20px;
+			}
+			#container li {
+				float: left;
+				list-style: none;
+				width: 60px;
+				height: 60px;
+			}
+		</style>
+	</head>
+	<body>
+		<div id="container">
+			<img src="img/hello.jpg" alt="">
+			<ul>
+				<li><img src="img/thumb-1.jpg" alt=""></li>
+				<li><img src="img/thumb-2.jpg" alt=""></li>
+				<li><img src="img/thumb-3.jpg" alt=""></li>
+			</ul>
+		</div>
+		<script src="js/common.js"></script>
+		<script>
+		+function() {
+			// 通过querySelector用父子选择器获取img标签
+			var img = document.querySelector('#container>img');
+
+			function showPhoto(evt) {
+				evt = evt || window.event;
+				// 获取事件源(谁引发了事件)
+				var target = evt.target || evt.srcElement;
+				img.src = "img/" + target.parentNode.photoName;
+			}
+
+			var imgNames = ["hello.jpg", "goodbye.jpg", "oneshit.jpg"];
+			// 通过querySelectorAll用后代选择器获取指定的li标签
+			// var ul = document.querySelector("#container>ul");
+			// 通过元素获取相关节点的属性:
+			// parentNode - 获取父节点
+			// children - 获取所有子节点
+			// nextSibling - 获取相邻下一个兄弟节点
+			// previousSibling - 获取相邻上一个兄弟节点
+			var ul = img.nextSibling.nextSibling;
+			console.log(ul);
+			for (var i = 0; i < ul.children.length; i += 1) {
+				ul.children[i].photoName = imgNames[i];
+				bind(ul.children[i], "mouseover", showPhoto);
+			}
+		}();
+		</script>
+	</body>
+</html>