javascript基础
一、js的简介
1、js是什么
js是可以嵌入到html中，是 基于对象 和 事件驱动 的 脚本语言（不需要编译，可以嵌入到其它语言）
特点：
(1)交互性
(2)安全性：js不能访问本地磁盘
(3)跨平台：浏览器中都具备js解析器
2、js能做什么
(1)js能动态的修改(增删)html和css的代码
(2)能动态的校验数据
3、js历史及组成
ECMAScript BOM(浏览器对象模型) DOM(文档对象模型)
4、js被引入的方式
(1)内嵌脚本
<input type="button" value="button" onclick="alert('xxx')" />
(2)内部脚本
<script type="text/javascript">
alert("xxx");
</script>
(3)外部脚本
首先先创建一个js文件
其次在html中引入
<script type="text/javascript" src="demo1.js"></script>
js代码放在哪？
放在哪都行 但是在不影响html功能的前提下 越晚加载越好
二、js基本语法
1、变量
(1)
var x = 5;
x = 'javascript';
var y = "hello"; 在js中单引和双引一致
var b = true;
(2)
x = 5;
2、原始（基本）数据类型
(1)number:数字类型
(2)string：字符串类型
(3)boolean:布尔类型
(4)null:空类型
(5)undefined:未定义 typeof 判断类型
注意：number、boolean、string是伪对象，能调方法
类型转换：
number\boolean转成string
toString();
string\boolean转成number
parseInt()
parseFloat()
boolean不能转 parseInt(true)得到NaN
string可以将数字字符串转换成number 如果“123a3sd5” 转成123（parseInt(123a3sd5)默认舍去非数字后的字符）
强制转换
Boolean() 强转成布尔
数字强转成布尔 非零就是true Boolean(123) 零就是false Boolean(0)
字符串强转成布尔 非“”(空字符串)就是true Boolean(true) 空字符串“”就是false
Number() 强转成数字
布尔转数字 true转成1 false转成0
字符串转数字 不能强转 NaN
3、引用数据类型
java: Object obj = new Object();
js: var obj = new Object(); object类型
var num = new Number();
4、运算符
(1)赋值运算符
var x = 5;
(2)算数运算符
+ - * / %
+: 遇到字符串变成连接
-：先把字符串转成数字然后进行运算
*: 先把字符串转成数字然后进行运算
/: 先把字符串转成数字然后进行运算
(3)逻辑运算符
&& || 短路作用
(4)比较运算符
< > >= <= != ==
===:全等：类型与值都要相等
(5)三元运算符
3>2?"大于":"小于" 大于
(6)void运算符
<a href="javascript:void(0);">xxxxxx</a> 不会跳转
(7)类型运算符
typeof:判断数据类型 返回我的数据类型
instanceof：判断数据类型 是否是某种类型 返回true/false
var obj = new Object();
alert(typeof obj);//object
alert(obj instanceof Object);//true
5、逻辑语句
(1)if-else
//条件:true/false
//数字非0 字符串非空====true
if(9){
alert("true--");
}else{
alert("false--");
}
(2)switch
var x = "java";
switch(x){
case "css":
alert("css");
break;
case "js":
alert("js");
break;
case "java":
alert("java");
break;
default:
alert("def");
}
打印java
(3)for
for(var i = 0;i<5;i++){
alert(i);
}
(4)for in
var arr = [1,3,5,7,"js"];
for(index in arr){//index代表角标
//alert(index); //0 1 2 3 4
alert(arr[index]); //1 3 5 7 js
}
三、js内置对象
(1)Number 数字对象
创建方式：
var myNum=new Number(value);
var myNum=Number(value); type:object
参数 value 是要创建的 Number 对象的数值，或是要转换成数字的值。
属性和方法：
toString():转成字符串 type:string
valueOf()：返回一个 Number 对象的基本数字值 type:number
(2)Boolean
创建方式：
var bool = new Boolean(value);
var bool = Boolean(value);
属性和方法：
toString():转成字符串
valueOf()：返回一个 Boolean 对象的基本值(boolean)
(3)String
创建方式：
var str = new String(s);
var str = String(s);
属性和方法：
length:字符串的长度
charAt():返回索引字符
charCodeAt:返回索引字符unicode
indexOf():返回字符的索引
lastIndexOf();逆向返回字符的索引
split();将字符串按照特殊字符切割成数组
substr():从起始索引号提取字符串中指定数目的字符
substring():提取字符串中两个指定的索引号之间的字符（包括头不包括尾）
toLocalCase();转小写
toUpperCase();转大写
示例：
var str = "a-b-cdc-FG";伪对象，也可调用属性和方法
var str = new String("a-b-cdc-FG");
//alert(str.length);//10
//alert(str.charAt(4));//c
//alert(str.charCodeAt(4));//99
//alert(str.indexOf("c"));//4
//alert(str.lastIndexOf("c"));//6 角标还是从前往后数
//var arr = str.split("-");
/* for(var i=0;i<arr.length;i++){
alert(arr[i]); //a b c d c F G
} */
//alert(str.substr(2,3));//b-c
//alert(str.substring(2,3));//b
//alert(str.toUpperCase()); //A-B-CDC-FG
(4)Array
创建方式：
var arr = new Array();//创建空数组
var arr = new Array(size);//创建一个指定长度的数据
var arr = new Array(element0, element1, ..., element n);//创建数组直接实例化元素
var arr = [];//空数组
var arr = [1,2,5,"java"];//创建数组直接实例化元素
属性和方法：
length:数组长度
join()：把数组的所有元素放入一个字符串。元素通过指定的分隔符进行分隔一个
pop():删除并返回最后元素
push()：向数组的末尾添加一个或更多元素，并返回新的长度
reverse();反转数组
sort();排序
示例：
//var arr = [3,"z",1,"java",'js',true,4];
//alert(arr.length);//7
//alert(arr.join("-"));//3-7-1-java-js-true-4
//alert(arr.pop()); //4
//alert(arr); //3,7,1,"java",'js',true
//alert(arr.push("R")); 8
//alert(arr); //3,7,1,"java",'js',true,4,R
//alert(arr.reverse()); 4,true,'js',"java",1,"z",3
//alert(arr.sort());//按照字符串字典顺序进行排序 1,3,4,"java","js",true,"z"
(5)Date
创建方式：
var myDate = new Date();
var myDate = new Date(毫秒值);//代表从1970-1-1到现在的一个毫秒值
属性和方法
getFullYear():年
getMonth():月 0-11
getDate():日 1-31
getDay()：星期 0-6(星期天是0)
getTime():返回1970年1月1日午夜到指定日期（字符串）的毫秒数
toLocalString();获得本地时间格式的字符串
示例：
var date = new Date();
//alert(date.toString()); //Sat Jan 14 2017 07:19:25 GMT+0800
//alert(date.toLocaleString()); //2017/1/14 上午7:19:25
/* alert("year:"+date.getFullYear());//2017
alert("month:"+date.getMonth());//0
alert("date:"+date.getDate());//14
alert("day:"+date.getDay());//6 */
/* var time1 = date.getTime();
var time2 = 1*24*60*60*1000;
alert(new Date(time1+time2).toLocaleString()); */ //显示明天的这个时间 2017/1/15 上午7:25:11
(6)Math
创建方式：
Math 对象并不像 Date 和 String 那样是对象的类，因此没有构造函数 Math()，像 Math.sin() 这样的函数只是函数，
不是某个对象的方法。您无需创建它，通过把 Math 作为对象使用就可以调用其所有属性和方法。
属性和方法
PI：圆周率
abs():绝对值
ceil():对数进行上舍入
floor():对数进行下舍入
pow(x,y)：返回 x 的 y 次幂
random():0-1之间的随机数，包含
round():四舍五入
示例：
/* var x = "-897";
alert(Math.abs(x)); 897 */
/* var x = 12.34;
var y = 2;
var z = 4; */
/* alert(Math.ceil(x));//13
alert(Math.floor(x));//12
alert(Math.round(x));//12 */
//alert(Math.pow(y, z));//16
//alert(Math.random());
(7)RegExp
创建方式：
var reg = new RegExp(pattern);
var reg = /^正则规则$/;
规则的写法：
[0-9]
[A-Z]
[a-z]
[A-z] 大小写都可以
\d 代表数字(digit)
\D 非数字
\w 查找单词字符(word)
\W 查找非单词字符
\s 查找空白字符(space)
\S 查找非空白字符
n+ 出现至少一次
n* 出现0次或多次
n? 出现0次或1次
{5} 出现5
{2,8} 2到8次
方法：
test(str):检索字符串中指定的值。返回 true 或 false
需求：
校验邮箱：邮箱的正则表达式: /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+(.[a-zA-Z0-9_-])+/
var email = haohao_827@163.com
var reg = /^[A-z]+[A-z0-9_-]*\@[A-z0-9]+\.[A-z]+$/;
reg.test(email);
四、js的函数
1、js函数定义的方式
(1)普通方式
语法：function 函数名(参数列表){函数体}
示例：
function method(){
alert("xxx");
}
method();
(2)匿名函数
语法：function(参数列表){函数体}
示例：
var method = function(){
alert("yyy");
};
method();
(3)对象函数
语法：new Function(参数1,参数2,...,函数体);
注意：参数名称必须使用字符串形式、最后一个默认是函数体且函数体需要字符串形式
示例：
var fn = new Function("a","b","alert(a+b)");
fn(2,5); // 7
2、函数的参数
(1)形参没有var去修饰
(2)形参和实参个数不一定相等
(3)arguments对象 是个数组 会将传递的实参进行封装
function fn(a,b,c){
//var sum = a+b+c;
//alert(sum);
//arguments是个数组 会将传递的实参进行封装
for(var i=0;i<arguments.length;i++){
alert(arguments[i]); //1 2 4 8
}
}
fn(1,2); //NaN
fn(1,2,4,8); //7
3、返回值
(1)在定义函数的时候不必表明是否具有返回值
(2)返回值仅仅通过return关键字就可以了 return后的代码不执行
function fn(a,b){
return a+b;
//alert("xxxx");
}
alert(fn(2,3));
4、js的全局函数（js已经定义好的，直接可以调用）
(1)编码和解码
encodeURI() decodeURI()
encodeURIComponet() decodeURIComponent()
escape() unescape()
三者区别：
进行编码的符号范围不同吧，实际开发中常使用第一种
示例
var url = "http://www.baidu.com?name=张&password=123";
alert(encodeURI(url));
//http://www.baidu.com?name=%E5%BC%A0&password=123 只转中文
alert(encodeURIComponent(url));
//http%3A%2F%2Fwww.baidu.com%3Fname%3Dzhangsan%26password%3D123
alert(escape(url));
//http%3A//www.baidu.com%3Fname%3Dzhangsan%26password%3D123
(2)强制转换
Number()
String()
Boolean()
(3)转成数字
parseInt()
parseFloat()
(4)eval()方法
将字符串当作脚本进行解析运行
//var str = "var a=2;var b=3;alert(a+b)";
//eval(str); //5
function print(str){
eval(str);
}
print("自定义逻辑");
五、js的事件
事件
事件源
响应行为
1、js的常用事件
onclick:点击事件
onchange:域内容被改变的事件
需求：实现二级联动
<select id="city">
<option value="bj">北京</option>
<option value="tj">天津</option>
<option value="sh">上海</option>
</select>
<select id="area">
<option>海淀</option>
<option>朝阳</option>
<option>东城</option>
</select>
<script type="text/javascript">
var select = document.getElementById("city");
select.onchange = function(){
var optionVal = select.value;
switch(optionVal){
case 'bj':
var area = document.getElementById("area");
area.innerHTML = "<option>海淀</option><option>朝阳</option><option>东城</option>";
break;
case 'tj':
var area = document.getElementById("area");
area.innerHTML = "<option>南开</option><option>西青</option><option>河西</option>";
break;
case 'sh':
var area = document.getElementById("area");
area.innerHTML = "<option>浦东</option><option>杨浦</option><option>长宁</option>";
break;
default:
alert("error");
}
};
</script>
onfocus:获得焦点的事件
onblur:失去焦点的事件
需求： 当输入框获得焦点的时候，提示输入的内容格式
当输入框失去焦点的时候，提示输入有误
<label for="txt">name</label>
<input id="txt" type="text" /><span id="action"></span>
<script type="text/javascript">
var txt = document.getElementById("txt");
txt.onfocus = function(){
//友好提示
var span = document.getElementById("action");
span.innerHTML = "用户名格式最小8位";
span.style.color = "green";
};
txt.onblur = function(){
//错误提示
var span = document.getElementById("action");
span.innerHTML = "对不起 格式不正确";
span.style.color = "red";
};
</script>
onmouseover:鼠标悬浮的事件
onmouseout:鼠标离开的事件
需求：div元素 鼠标移入变为绿色 移出恢复原色
#d1{background-color: red;width:200px;height: 200px;}
<div id="d1"></div>
<script type="text/javascript">
var div = document.getElementById("d1");
div.onmouseover = function(){
this.style.backgroundColor = "green";
};
div.onmouseout = function(){
this.style.backgroundColor = "red";
};
</script>
onload:加载完毕的事件
等到页面加载完毕在执行onload事件所指向的函数
<span id="span"></span>
<script type="text/javascript">
window.onload = function(){
var span = document.getElementById("span");
alert(span);
span.innerHTML = "hello js";
};
</script>
2、事件的绑定方式
(1)将事件和响应行为都内嵌到html标签中
<input type="button" value="button" onclick="alert('xxx')"/>
(2)将事件内嵌到html中而响应行为用函数进行封装
<input type="button" value="button" onclick="fn()" />
<script type="text/javascript">
function fn(){
alert("yyy");
}
</script>
(3)将事件和响应行为 与html标签完全分离
<input id="btn" type="button" value="button"/>
<script type="text/javascript">
//找到标签
var btn = document.getElementById("btn");
btn.onclick = function(){
alert("zzz");
};
</script>
****this关键字
this经过事件的函数进行传递的是html标签对象
<input id="btn" name="mybtn" type="button" value="button123" onclick="fn(this)"/>
<script type="text/javascript">
function fn(obj){
alert(obj.name); //mybtn
}
</script>
3、阻止事件的默认行为
IE：window.event.returnValue = false;
W3c: 传递过来的事件对象.preventDefault();
//ie：window.event.returnValue = false;
//W3c：传递过来的事件对象.preventDefault();
//W3c标准
if(e&&e.preventDefault){
alert("w3c");
e.preventDefault();
//IE标签
}else{
alert("ie");
window.event.returnValue = false;
}
//通过事件返回false也可以阻止事件的默认行为
<a href="demo11.html" onclick="return false">点击我吧</a>
4、阻止事件的传播
IE：window.event.cancelBubble = true;
W3c: 传递过来的事件对象.stopPropagation();
if(e&&e.stopPropagation){
alert("w3c");
e.stopPropagation();
//IE标签
}else{
alert("ie");
window.event.cancelBubble = true;
}
六、js的bom
(1)window对象
弹框的方法：
提示框：alert("提示信息");没有返回值
确认框：confirm("确认信息");
有返回值：如果点击确认返回true 如果点击取消 返回false
var res = confirm("您确认要删除吗？");
alert(res);
输入框：prompt("提示信息");
有返回值：如果点击确认返回输入框的文本 点击取消返回null
var res = prompt("请输入密码？");
alert(res);
open方法：
window.open("url地址");
open("../jsCore/demo10.html");
定时器：
setTimeout(函数,毫秒值); 过了毫秒值之后去执行函数
setTimeout(
function(){
alert("xx");
},
3000
); //3秒后弹xx框
clearTimeout(定时器的名称);
示例：
//定义定时器
var timer;
var fn = function(){
alert("x");
timer = setTimeout(fn,2000);
};
var closer = function(){
clearTimeout(timer);
};
fn();
setInterval(函数,毫秒值);
clearInterval(定时器的名称)
var timer = setInterval(
function(){
alert("nihao");
},
2000
);
var closer = function(){
clearInterval(timer);
};
需求：注册后5秒钟跳转首页
恭喜您注册成功，<span id="second" style="color: red;">5</span>秒后跳转到首页，如果不跳转请<a href="../jsCore/demo10.html">点击这里</a>
<script type="text/javascript">
var time = 5;
var timer;
timer = setInterval(
function(){
var second = document.getElementById("second");
if(time>=1){
second.innerHTML = time;
time--;
}else{
//关闭定时器
clearInterval(timer);
location.href="http://www.baidu.com";
}
},
1000
);
</script>
(2)location
location.href="url地址";
(3)history
back();
forward();
go();
<a href="demo7.html">后一页</a>
<input type="button" value="上一页" onclick="history.back()">
<input type="button" value="下一页" onclick="history.forward()">
<input type="button" value="上一页" onclick="history.go(-1)">
<input type="button" value="下一页" onclick="history.go(1)">
七、js的dom
1、理解一下文档对象模型
html文件加载到内存之后会形成一颗dom树，根据这些节点对象可以进行脚本代码的动态修改
在dom树当中 一切皆为节点对象
2、dom方法和属性
(1) document.getElementById("id");
示例：
//输出 <input type="text" name="username" value="IT精英培训" id="tid" >标签value属性的值
var inputNode = document.getElementById("tid");
alert(inputNode.value);
//输出 <input type="text" name="username" value="IT精英培训" id="tid" >标签type属性的值
var inputNode = document.getElementById("tid");
alert(inputNode.type);
(2) document.getElementById("id");
//通过元素的name属性获取所有元素的引用
var inputNodes = document.getElementsByName("tname");
//测试该数据的长度
//alert(inputNodes.length);
//遍历元素,输出所有value属性的值
/* for(var i=0;i<inputNodes.length;i++){
var inputNode = inputNodes[i];
alert(inputNode.value);
} */
//为每个文本框(<input type="text">)增加change事件,当值改变时,输出改变的值
for(var i=0;i<inputNodes.length;i++){
var inputNode = inputNodes[i];
inputNode.onchange = function(){
alert(this.value);
};
}
(3) document.getElementsByTagName
<form name="form1" action="test.html" method="post" >
<input type="text" name="tname" value="IT精英培训_1" id="tid_1" ><br>
<input type="text" name="tname" value="IT精英培训_2" id="tid_2" ><br>
<input type="text" name="tname" value="IT精英培训_3" id="tid_3" ><br>
<input type="button" name="ok" value="保存1"/>
</form>
<select name="edu" id="edu">
<option value="博士">博士^^^^^</option>
<option value="硕士" selected="selected">硕士^^^^^</option>
<option value="本科" >本科^^^^^</option>
<option value="幼儿园">幼儿园^^^^^</option>
</select>
<select name="job" id="job" >
<option value="美容">美容^^^^^</option>
<option value="IT">IT^^^^^</option>
<option value="程序员">程序员^^^^^</option>
<option value="建筑师">建筑师^^^^^</option>
</select>
<br/>
<input id="btn" type="button" value="输出select被选中的值" />
//获取所有的input元素,返回值是数组
var inputNodes = document.getElementsByTagName("input");
//测试长度
//alert(inputNodes.length);
//遍历value的值
/* for(var i=0;i<inputNodes.length;i++){
var inputNode = inputNodes[i];
alert(inputNode.value);
} */
//输出type="text"中 value属性的值 不包含按钮(button)
/* for(var i=0;i<inputNodes.length;i++){
var inputNode = inputNodes[i];
if(inputNode.type=="text"){
alert(inputNode.value);
}
} */
//输出所有下拉选select的option标签中value的值
/* var optionNodes = document.getElementsByTagName("option");
for(var i=0;i<optionNodes.length;i++){
var optionNode = optionNodes[i];
alert(optionNode.value);
} */
//输出所有下拉选 id="edu"中option标签中 value属性的值
/* var edu = document.getElementById("edu");
var optionNodes = edu.getElementsByTagName("option");
for(var i=0;i<optionNodes.length;i++){
var optionNode = optionNodes[i];
alert(optionNode.value);
} */
//点击按钮输出下拉框中被选中的值
/* var btn = document.getElementById("btn");
btn.onclick = function(){
var optionNodes = document.getElementsByTagName("option");
for(var i=0;i<optionNodes.length;i++){
var optionNode = optionNodes[i];
if(optionNode.selected){ //返回true
alert(optionNode.value);
}
}
}; */
(4)hasChildNodes() 检查一个元素是否有子节点，返回true或false
//查看id="edu"的节点是否含有子节点
var edu = document.getElementById("edu");
//alert(edu.hasChildNodes());
（5）<form name="form1" action="test.html" method="post" >
<input type="text" name="tname" value="IT精英培训_1" id="tid_1" ><br>
<input type="text" name="tname" value="IT精英培训_2" id="tid_2" ><br>
<input type="text" name="tname" value="IT精英培训_3" id="tid_3" ><br>
<input type="button" name="ok" value="保存1"/>
</form>
<p id="pid">明天上课</p>
//元素节点 id="tid_1" 输出nodeName nodeType nodeValue
//var node = document.getElementById("tid_1");
/* alert(node.nodeName);//input nodeName是只读属性
alert(node.nodeType);//1 nodeType是只读属性
alert(node.nodeValue);//null */
//文本节点 id="pid" 输出nodeName nodeType nodeValue
/* var node = document.getElementById("pid");
var textNode = node.firstChild;
alert(textNode.nodeName);//#text
alert(textNode.nodeType);//3
alert(textNode.nodeValue);//明天上课 */
//属性节点 id="pid" 输出nodeName nodeType nodeValue
/* var node = document.getElementById("pid");
var p = node.getAttributeNode("id");
alert(p.nodeName);//id
alert(p.nodeType);//2
alert(p.nodeValue);//pid */
（6）
您喜欢的城市:<br>
<ul>
<li id="bj" value="beijing">北京</li>
<li id="sh" value="shanghai">上海</li>
<li id="cq" value="chongqing"> 重庆</li>
</ul>
您喜欢的游戏:<br>
<ul>
<li id="fk" value="fangkong">反恐<p>精英</p></li>
<li id="ms" value="moshou">魔兽</li>
<li id="cq" value="chuanqi">传奇</li>
</ul>
//点击北京节点， 将被反恐节点替换
var bj = document.getElementById("bj");
var fk = document.getElementById("fk");
bj.onclick = function(){
var parentNode = this.parentNode;
parentNode.replaceChild(fk,this);
};
（7） 得到属性值
//<li id="xj" value="xingji">星际争霸</li>节点的value属性的值
var xj = document.getElementById("xj");
alert(xj.getAttribute("value"));
设置属性值
//给这个节点增加 name属性 <li id="xj" value="xingji" name="xingjizhengba">星际争霸</li>
var xj = document.getElementById("xj");
xj.setAttribute("name","xingjizhengba");
//测试
alert(xj.getAttribute("name")); //xingjizhengba
（8）
您喜欢的城市:<br>
<ul id="city">
<li id="bj" value="beijing">北京</li>
<li id="sh" value="shanghai">上海</li>
<li id="cq" value="chongqing">重庆</li>
</ul>
您喜欢的游戏:<br>
<ul>
<li id="fk" value="fangkong">反恐</li>
<li id="ms" value="moshou">魔兽</li>
<li id="xj" value="xingji">星际争霸</li>
</ul>
//增加城市节点 <li id="tj" v="tianjin">天津</li>放置到city下
var li = document.createElement("li");
li.setAttribute("id","tj");
li.setAttribute("v","tianjin");
//添加文本节点
var txt = document.createTextNode("天津");
li.appendChild(txt);
var city = document.getElementById("city");
city.appendChild(li);
（9） <ul>
<li id="bj" name="beijing">北京</li>
<li id="sh" name="shanghai">上海</li>
<li id="cq" name="chongqing">重庆</li>
</ul>
// 创建新的节点 <li id="tj" name="tianjin">天津</li>
var li = document.createElement("li");
li.setAttribute("id","tj");
li.setAttribute("v","tianjin");
var txt = document.createTextNode("天津");
li.appendChild(txt);
// 在 <li id="cq" name="chongqing">重庆</li>的前面
var ul = document.getElementsByTagName("ul");
var cq = document.getElementById("cq");
ul[0].insertBefore(li,cq);
示例2：
// 在 上海节点的后面 插入天津节点<li id="tj" name="tianjin">天津</li>
var li = document.createElement("li");
li.setAttribute("id","tj");
li.setAttribute("v","tianjin");
var txt = document.createTextNode("天津");
li.appendChild(txt);
var ul = document.getElementsByTagName("ul");
var sh = document.getElementById("sh");
var cq = sh.nextSibling; （得到重庆节点）
ul[0].insertBefore(li,cq);
（10）
//删除<ul id="city"> 下<li id="bj" name="beijing">北京</li>这个节点</ul>
var city = document.getElementById("city");
var bj = document.getElementById("bj");
city.removeChild(bj);
（11） innerHTML
<body>
<div id="subject">jquery</div>
</body>
<script language="JavaScript">
//使用innerHTML读出id=subject中的文本内容
/* var div = document.getElementById("subject");
alert(div.innerHTML); */
//将<h1>今天</h1>写到div的层中
/* var div = document.getElementById("subject");
div.innerHTML = "<h1>今天</h1>"; */
</script>
