1.Windows对象：浏览器窗口。
2.document：页面文件
3.通用的事件：
onclick 单击；
onmousemove 鼠标移动；
onmouseout 鼠标移出；
onmouseover 鼠标移上；
4.window.open
第一部分：写要打开的页面地址
第二部分：打开的方式，_blank 是在新窗口打开 _self
第三部分：控制打开的窗口，可以写多个，用空格隔开
toolbar=no新打开的窗口无工具条
menubar=no无菜单栏 status=no无状态栏
width=100 height=100 宽度高度
left=100 打开的窗口距离左边多少距离
resizable=no窗口大小不可调
scrollbars=yes 出现滚动条
location=yes 有地址栏
5.打开窗口，并保存在一个变量中
var w= window.open()；
如果只打开窗口一次，
if(w==null)
{
w=window.open("http://www.baidu.com","_blank","toolbar=no");
}
这里用一个if语句，判断w的值是否为空，打开一个窗口之后w的值就不为空了，之后再点击鼠标调用此函数则不执行打开新窗口。
6.
<body>
<input type="button" value="打开窗口" onclick="Y()"/>
<input type="button" value="关闭窗口" onclick="G()"/>
</body>
<script type="text/javascript">
var w = window.open();
function Y()
{
if(w==null)
{
w = window.open("lizi.html","_blank","width=500 height=500");
}
}
function G()
{
w.close();
}
</script>
w.close：关闭保存在变量w中的那个窗口。
7.间隔与延迟
<body>
<input type="button" value="关闭间隔" onclick="Close()" />
</body>
<script type="text/javascript">
function Yan()
{
alert("aa");
}
var c = window.setInterval("Yan()",2000);
function Close()
{
window.clearInterval(c);
}
</script>
取对象
1.根据id名找 var d1 = document.getElementById("d1"); 最多找一个；( )里面是名字，将找到的元素放在变量中。
alert(d1);
2.根据class名找 var d2 = document.getElementsByClassName("d2"); 找出来的是数组
alert(d2[0]);
3.根据标签名找 var d3 = document.getElementsByTagName("div"); 找出来的是数组
alert(d3[1]);
4.表单元素 var d4 = document.getElementsByName("aa"); 找出来的是数组
alert(d4[1]);
操作
1.操作内容
var d1 = document.getElementById("d1");
获取内容 alert(d1.innerText); （只取里面的文字） alert(d1.innerHTML); （代码和文字都获取）
修改内容 d1.innerText = "<b>这是修改</b>"; d1.innerHTML = "<b>这是修改</b>";
2.操作属性
var d1 = document.getElementById("d1");
获取属性
alert(d1.getAttribute("width"));
设置属性
d1.setAttribute("width","200");
移除属性
d1.removeAttribute("width");
3.操作样式
var d1 = document.getElementById("d1");
获取样式(只能获取内联，内嵌和外部都不能获取)
alert(d1.style.color); alert(d1.style.backgroundColor);
修改样式
d1.style.backgroundColor = "";
以上都是先获取，后应用。
例题：
1.鼠标放上一个栏，变红色，鼠标离开整个div，那个栏依旧是红色，可以确认当前是处于哪个栏的网页。
<style type="text/css">
#caidan{
600px;
height:35px;
border:1px solid #F33;
}
.xiang{
float:left;
100px;
height:35px;
text-align:center;
line-height:35px;
vertical-align:middle;
}
</style>
<body>
<div id="caidan">
<div class="xiang" onmouseover="Huan(this)">淄博</div>
<div class="xiang" onmouseover="Huan(this)">张店</div>
<div class="xiang" onmouseover="Huan(this)">周村</div>
<div class="xiang" onmouseover="Huan(this)">临淄</div>
<div class="xiang" onmouseover="Huan(this)">沂源</div>
</div>
</body>
<script type="text/javascript">
function Huan(a)
{
var x = document.getElementsByClassName("xiang");
for(var i=0;i<x.length;i++)
{
x[i].style.backgroundColor = "white";
}
a.style.backgroundColor = "red";
}
</script>
另一种做法：
<style type="text/css">
#caidan{
600px;
height:35px;
border:1px solid #F33;
}
.xiang{
float:left;
100px;
height:35px;
text-align:center;
line-height:35px;
vertical-align:middle;
}
</style>
<body>
<div id="caidan">
<div class="xiang" onmouseover="Huan(this)" onmouseout="Hui(this)">淄博</div>
<div class="xiang" onmouseover="Huan(this)" onmouseout="Hui(this)">张店</div>
<div class="xiang" onmouseover="Huan(this)" onmouseout="Hui(this)">周村</div>
<div class="xiang" onmouseover="Huan(this)" onmouseout="Hui(this)">临淄</div>
<div class="xiang" onmouseover="Huan(this)" onmouseout="Hui(this)">沂源</div>
</div>
</body>
<script type="text/javascript">
function Huan(a)
{
var x = document.getElementsByClassName("xiang");
a.style.backgroundColor = "red";
}
function Hui(a)
{
var y = document.getElementsByClassName("xiang");
a.style.backgroundColor = "white";
}
</script>
总结：在div里面加上onmouseout（鼠标移出）这个点击事件，放上一个栏，变红色，离开了，这个div整个还是白色背景，其实现的效果与:hover实现的功能类似。
2.题目：倒计时从10开始，一直到0，然后同意按钮变成可以提交的。这里用到了间隔，用了操作属性：disabled,来改变按钮的状态，当disabled="disabled"时按钮不可用。用if，else的判断。如下图所示：
<body>
<input type="button" value="同意" disabled="disabled" id="ty" />
<span id="shu">10</span>
</body>
<script type="text/javascript">
window.setInterval("Tiao()",1000)
function Tiao()
{
var shu = document.getElementById("shu");
var ty = document.getElementById("ty");
if(parseInt(shu.innerHTML)==0)
{
ty.removeAttribute("disabled")
}
else
{
var x = parseInt(shu.innerHTML)-1;
shu.innerHTML=x;
}
}
</script>
3.有一组数，让其重复的数字去掉，只显示一次，效果如图：
<script type="text/javascript">
var atrr = [301, 504,8, 1, 7, 3, 2, 4, 6, 1,66,0,14,100,0,45,100,78,100];
var atrr2 = []; /* 重新定义一个数组，把attr里筛选出来的数放在里面*/
Qu(); /*调用函数*/
function Qu()
{
for(var i = 0; i < atrr.length; i++)
{
var s = 0; /*重新定义了一个变量，用来显示 是否有重复的值出现*/
for(var j = 0; j < atrr2.length; j++)
{
if(atrr[i] == atrr2[j]) /* 判断如果attr里的值与新添加进去的值相等，说明是有重复的*/
{
s = 1; /*去掉那个重复的数，不让其再添加到attr2中去了*/
}
}
if(s == 0) /*重复的数去掉了，可以把剩下的数放到attr2中去了*/
{
atrr2.push(atrr[i]);
}
}
}
alert(atrr2); /* 显示出一个框。*/
</script>
总结：定义一个新的变量，代表的含义是还有没有重复的数，这样才可以把数放在那个新定义的数组里