JavaScript

一、基本介绍

1995年诞生，当时的主要目的是验证表单数据是否合法。
科普：JavaScript原本应该叫livesScript，但是在发布前夕想搭上超热的JAVA的顺风车，将名称改为JavaScript，也就是说JS与JAVA没关系。

二、基础语法

写在html便签结尾后

	<script>
		js内容
	</script>

写在head标签里

	<script>
		window.onload = function(){
			// js具体内容
		}
	</script>

1.弹出对话框

	alert("内容");

2.找元素、标签、标记

	// 根据ID找元素、标签、标记
	document.getElementById("div1");
	// 根据类名
	document.getElementsByClassName("div")[1].style;
	// 根据标签名
	var divStyle = document.getElementsByTagName("div")[1].style;

3.实体化盒

想设置谁就要先找到它，然后用“.“进行连接

	document.getElementById("div2").style.width = "100px";
	document.getElementById("div2").style.height = "100px";
	document.getElementById("div2").style.background = "blue";

通过设置变量之后可简化为：

	// 变量名可以使用“_”、“$”，但是不能使用“-”，这个符号在js中默认为减号
	var dyr = document.getElementById("div2").style;
	dyr.width = "200px";
	dyr.height = "200px";
	dyr.background = "green";

4.JS事件

	// 事件三要素：事件源.事件类型 = 匿名函数 
	// 匿名函数：要执行的事情
	var changeWidth = document.getElementById("but1");
	changeWidth.onclick = function(){
		// 点击后执行的命令
		 div1Style.width = "200px";
	}
	// 双击事件
	changeHeight.ondblclick = function(){}
	// 鼠标移入事件
	changeColor.onmouseover = function(){}
	// 鼠标移出事件
	changeColor.onmouseout = function(){}

5. JS的书写位置

内嵌式：

	<script type="text/javascript"></script>

外链式：

	<script src="js.js" type="text/javascript" charset="utf-8"></script>

行内：

	<div id = "div1" onclick=alert("行内")></div>

6. 动态添加、删除html文本内容

	but_add.onclick = function(){
		box.innerHTML = '一条提示信息';
	}
	but_del.onclick = function(){
		box.innerHTML = "";
	}