cursor属性：改变鼠标中的属性 例如：
cursor：pointer（鼠标移动上去变小手）
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<style>
#d1{
height: 200px;
200px;
background-color: red;
}
#d1:hover{
/*鼠标变小手*/
cursor:pointer;
}
</style>
</head>
<body>
<div id="d1"></div>
</body>
</html>
有很多种类的属性值可以搜索使用
找元素的几种方式：
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>找元素的几种方式</title>
<script type="text/javascript">
window.onload=function(){
//通过ID属性找元素(得到一个元素对象)
var doc=document.getElementById("p");
//通过class属性找到元素(得到一个数组)
var arr = document.getElementsByClassName("p1");
alert(arr.length);
//通过元素名称找元素(得到一个数组)
var arr2 = document.getElementsByTagName("p");
}
</script>
</head>
<body>
<p class="p1">a</p>
<p class="p1">b</p>
<p class="p1">c</p>
<p class="p">d</p>
</body>
</html>
轮播图的效果：
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>轮播图效果</title>
<script type="text/javascript">
var arr=null;
var tp = null;
var index = 0;
//当页面加载完成以后执行
window.onload=function(){
//定义一个一维数组用来存储图片
arr = ["images/d.jpg","images/q.jpg","images/c.jpg","images/b.jpg"];
//获取img元素
tp = document.getElementById("tp");
start();
}
function change(obj){
//获取用户点击的是哪个按钮
index = obj.value;
tp.src=arr[index];
}
//下一页
function next(){
//如果当前图片是最后一张
if(index==arr.length-1){
index=0;
}else{
index=index+1;
}
tp.src=arr[index];
}
//上一页
function up(){
//如果当前图片是最后一张
if(index==0){
index=arr.length-1;
}else{
index=index-1;
}
tp.src=arr[index];
}
//自动开始轮播
function start(){
var timer = setInterval("next()",3000);
}
</script>
</head>
<body>
<img src="images/d.jpg" alt="" id="tp">
<input type="button" value="上一页" onClick="up()">
<input type="button" value="0" onClick="change(this)">
<input type="button" value="1" onClick="change(this)">
<input type="button" value="2" onClick="change(this)">
<input type="button" value="3" onClick="change(this)">
<input type="button" value="下一页" onClick="next()">
</body>
</html>