20-javaScript高级

javascript面向对象(了解)

1 .类的定义和使用方式一(了解)

//定义Person类
class Person{
  //构造方法
  constructor(name,age){
    this.name = name;
    this.age = age;
  }

  //show方法
  show(){
    document.write(this.name + "," + this.age + "<br>");
  }

  //eat方法
  eat(){
    document.write("吃饭...");
  }
}

//使用Person类
let p = new Person("张三",23);
p.show();
p.eat();

2. 类的定义和使用方式二-字面量方式(重要)

/*
        类的第二种定义方式--字面量/直接量方式，因为定义出来的就是对象，不需要new可以直接使用
        语法：
            let 对象名={
                属性名:属性值,
                属性名:属性值,
                ...
                属性名:属性值   //属性值可以是任意类型，原始数据类型、数组、函数
            }
     */
//定义对象
let person={
  name:"张云祥",
  age:20,
  hobby:["唱","跳","rap","basketball"],
  show:function () {
    document.write(`${this.name},${this.age}<br>`);
  },
  add:function (a,b) {
    return a+b;
  },
  eat(){ //也可以
    document.write("吃饭...<br>")
  }
};

//使用对象
document.write(person.hobby+"<br>");   //["唱","跳","rap","basketball"]
person.show(); //张云祥,20

let sum = person.add(10,20);

document.write(`sum=${sum}<br>`); //sum=30
person.eat(); //吃饭...

javascript内置对象(理解)

1. Number类

方法名	说明
parseFloat	将传入的字符串浮点数转为浮点数
pasreInt	将传入的字符串整数转为整数

//1. parseFloat()  将传入的字符串浮点数转为浮点数
// let f=Number.parseFloat("13.14");
let f=Number.parseFloat("13.1452abc"); //从左往右一个字符一个字符的转换，遇到不能转换的字符为止
document.write(f+","+typeof (f)+"<br>");

//2. parseInt()    将传入的字符串整数转为整数
// let n = Number.parseInt("100abc");
let n = Number.parseInt("101.25");
document.write(n+","+typeof (n)+"<br>");//从左往右一个字符一个字符的转换，遇到不能转换的字符为止

2 .Math类(掌握)

方法名	说明
ceil(x)	向上取整
floor(x)	向下取整
round(x)	把数四舍五入为最接近的整数
random()	随机数,放回的是0.0-1.0之间的范围(包含头不包含尾)
pow(x,y)	幂运算x的y次方

//1. ceil(x) 向上取整 ****************掌握
document.write(Math.ceil(5.3)+"<br>"); //6
document.write(Math.ceil(-5.3)+"<br>"); //-5
//2. floor(x) 向下取整 ****************掌握
document.write(Math.floor(5.3)+"<br>"); //5
document.write(Math.floor(-5.3)+"<br>"); //-6
//3. round(x) 把数四舍五入为最接近的整数
document.write(Math.round(5.3)+"<br>"); //5
document.write(Math.round(-5.3)+"<br>"); //-5


//4. random() 随机数,返回的是 0.0-1.0 之间范围(含头不含尾)
document.write(Math.random()+"<br>"); // [0.0,1.0)


//需求：生成[10,100]的整数  [10,100]-->[0,90]+10-->[0,91)+10
let num=Math.floor( Math.random()*91 )+10;


document.write("num="+num+"<br>");
//5. pow(x,y) 幂运算 x的y次方
document.write(Math.pow(2,3)+"<br>");

3. Date类(掌握)

3.1 构造方法

构造方法	说明
Date	根据当前时间创建时间
Date(value)	根据指定毫秒值创建对象
Date(year,month,[day,hours,minutes,seconds,milliseconds])	根据指定字段创建对象(月份是0~11)

3.2 成员方法

方法名	说明
getFullYear()	获取年份
getMonth()	获取月份
getDate()	获取天数
getHours()	获取小时
getMinutes()	获取分钟
getSeconds()	获取秒数
getTime	返回1970年1月1号至今的毫秒数
toLocaleString	返回本地日期格式的字符串

<script>
    //构造方法
    //1. Date()  根据当前时间创建对象
    let d1 = new Date();
    document.write(d1 + "<br>");

    //2. Date(value) 根据指定毫秒值创建对象
    let d2 = new Date(10000);
    document.write(d2 + "<br>");

    //3. Date(year,month,[day,hours,minutes,seconds,milliseconds]) 根据指定字段创建对象(月份是0~11)
    let d3 = new Date(2222,2,2,20,20,20);
    document.write(d3 + "<br>");

    //成员方法
    //1. getFullYear() 获取年份
    document.write(d3.getFullYear() + "<br>");

    //2. getMonth() 获取月份
    document.write(d3.getMonth() + "<br>");

    //3. getDate() 获取天数
    document.write(d3.getDate() + "<br>");

    //4. toLocaleString() 返回本地日期格式的字符串
    document.write(d3.toLocaleString());
</script>

4 String类

4.1 构造方法

构造方法	说明
String	指定字符串创建对象
let s = “字符串”	直接赋值

4.2 成员方法

方法	说明
length属性	获取字符串长度
charAt(index)	获取指定索引处的字符
indexOf(value)	获取指定字符串出现的索引位置找不到为-1
subString(start,end)	根据指定索引范围截取字符串(含头不含尾)
split(value)	根据指定规则切割字符串,返回数组
replace(old,new)	使用新字符串替换老字符串

<script>
    //1. 构造方法创建字符串对象
    let s1 = new String("hello");
    document.write(s1 + "<br>");

    //2. 直接赋值
    let s2 = "hello";
    document.write(s2 + "<br>");

    //属性
    //1. length   获取字符串的长度
    document.write(s2.length + "<br>");

    //成员方法
    //1. charAt(index)     获取指定索引处的字符
    document.write(s2.charAt(1) + "<br>");

    //2. indexOf(value)    获取指定字符串出现的索引位置
    document.write(s2.indexOf("l") + "<br>");

    //3. substring(start,end)   根据指定索引范围截取字符串(含头不含尾)
    document.write(s2.substring(2,4) + "<br>");

    //4. split(value)   根据指定规则切割字符串，返回数组
    let s3 = "张三,23,男";
    let arr = s3.split(",");
    for(let i = 0; i < arr.length; i++) {
        document.write(arr[i] + "<br>");
    }

    //5. replace(old,new)   使用新字符串替换老字符串
    let s4 = "你会不会跳伞啊？让我落地成盒。你妹的。";
    let s5 = s4.replace("你妹的","***");
    document.write(s5 + "<br>");
</script>

5 RegExp类

正则表达式：是一种对字符串进行匹配的规则。

5.1 匹配的规则

[a-z]	这个字符必须是小写字母
[abc]	字符必须是abc
[0-9]	这个字符必须是数字
[a-zA-Z0-9]	这个字符必须是字母或者是数字
[^a-z]	这个字符不是小写字母

[\d]	等同于[0-9]
[\w]	等同于[a-zA-Z_0-9] 字母、数字、下划线
[\D]	等同于[^0-9]
[\W]	等同于[^a-zA-Z0-9_]
.	代表匹配任意字符， 若只是想代表普通数据.  需要使用转义字符来表示\.

X* 	X这个字符可以出现零次或者多次[0-9]*
X? 	X这个字符可以出现零次或者一次[0-9]? 
X+ 	X这个字符可以出现一次或者多次 [0-9]+

X{m} 	X这个字符出现次数正好m次  
X{m, } 	X这个字符出现次数至少m次
X{m, n} X这个字符出现次数至少m次,最多n次  
(X)+ 	()括号代表X所表示的内容作为一组数据出现；()括号后面的+号，代表这组数据可以出现一次或者多次
^X 		^匹配开头
X$ 		$匹配结尾

5.2 构造方法和成员方法

构造方法

构造方法	说明
RegExp(规则)	根据指定规则创建对象
let reg = /^规则$/	直接赋值

成员方法

成员方法	说明
test(匹配的字符串)	根据指定规则验证字符串是否合法

//1.验证手机号
//规则：第一位1，第二位358，第三到十一位必须是数字。总长度11
let regExp = new RegExp("[1][358][0-9]{9}");
document.write(regExp.test("16578907890")+"<br>"); //false
//2.验证用户名
//规则：字母、数字、下划线组成。总长度4~16
//regExp=/^[0-9a-zA-Z_]{4,16}$/;  //直接量方式不能使用引号引起来,正则是一个对象不是字符串。
regExp=/^\w{4,16}$/;  //直接量方式不能使用引号引起来,正则是一个对象不是字符串。
document.write(regExp.test("sfsdfa")+"<br>"); //true

6 Array类

表示数组对象，构造方法为：Array();一般定义数组使用[]方式定义。

成员方法：

方法	说明
push(元素)	添加元素到数组末尾
pop()	删除数组末尾的元素
shift()	删除数组最前面的元素
includes(元素)	判断数组是否包含给定的值
reverse()	反转数组中的元素
sort	对数组元素排序

let arr = [1,2,3,4,5];
//1. push(元素)    添加元素到数组的末尾
arr.push(6);  //等价于arr[5]=6;
document.write(arr + "<br>"); //1,2,3,4,5,6

//2. pop()         删除数组末尾的元素
arr.pop();
document.write(arr + "<br>");  //1,2,3,4,5

//3. shift()       删除数组最前面的元素
arr.shift();
document.write(arr + "<br>"); //2,3,4,5

//4. includes(元素)  判断数组中是否包含指定的元素
document.write( arr.includes(3)+ "<br>"); //true
//5. reverse()      反转数组元素
arr.reverse();
document.write(arr + "<br>"); //5,4,3,2

//6. sort()         对数组元素排序
arr.sort();  //升序
document.write(arr + "<br>"); //2,3,4,5
arr.sort((m,n)=>n-m);  //传递比较器,降序
document.write(arr + "<br>"); //5,4,3,2

7 Set集合类

JavaScript 中的 Set 集合，元素唯一，存取顺序一致。

构造方法和成员方法

构造方法

构造方法	说明
Set()	创建Set集合对象

成员方法

成员方法	说明
add(元素)	向集合中添加元素
size属性	获取集合长度
keys()	获取迭代器对象
delete(元素)	删除指定元素

// Set()   创建集合对象
    let s = new Set();

    // add(元素)   添加元素
    s.add("a");
    s.add("b");
    s.add("c");
    s.add("c");

    // size属性    获取集合的长度
    document.write(s.size + "<br>");    // 3

    // keys()      获取迭代器对象
    let st = s.keys();
    for(let i = 0; i < s.size; i++){
        document.write(st.next().value + "<br>");
    }

    // delete(元素) 删除指定元素
    document.write(s.delete("c") + "<br>");
    let st2 = s.keys();
    for(let i = 0; i < s.size; i++){
        document.write(st2.next().value + "<br>");
    }

8 Map集合类

JavaScript 中的 Map 集合，key 唯一，存取顺序一致。

构造方法和成员方法

构造方法

构造方法	说明
Map()	创建Map集合对象

成员方法

成员方法	说明
set(key,value)	向集合中添加元素
size属性	获取集合长度
get(key)	根据key获取value
entries()	获取迭代器对象
delete(key)	根据key删除键值对

// Map()   创建Map集合对象
    let map = new Map();

    // set(key,value)  添加元素
    map.set("张三",23);
    map.set("李四",24);
    map.set("李四",25);

    // size属性     获取集合的长度
    document.write(map.size + "<br>");

    // get(key)     根据key获取value
    document.write(map.get("李四") + "<br>");

    // entries()    获取迭代器对象
    let et = map.entries();
    for(let i = 0; i < map.size; i++){
        document.write(et.next().value + "<br>");
    }

    // delete(key)  根据key删除键值对
    document.write(map.delete("李四") + "<br>");
    let et2 = map.entries();
    for(let i = 0; i < map.size; i++){
        document.write(et2.next().value + "<br>");
    }

9 JSON类(掌握)

​ JSON(JavaScript Object Notation)：是一种轻量级的数据交换格式。

​ 简洁和清晰的层次结构使得 JSON 成为理想的数据交换语言。易于人阅读和编写，同时也易于计算机解析和 生成，并有效的提升网络传输效率。

JSON常用方法

方法名	说明
stringify(对象)	将指定对象转换为json格式对象
parse(字符串)	将指定json格式字符串解析成对象

//定义商品对象
let products=[
  {"key":"笔记本电脑","qre":"906390"},
  {"key":"笔记本子","qre":"937799"},
  {"key":"笔记本文具","qre":"400132"},
  {"key":"笔记本散热器","qre":"105018"},
  {"key":"笔记本支架","qre":"179625"},
  {"key":"笔记本自营","qre":"934656"},
  {"key":"笔记本游戏本","qre":"705309"},
  {"key":"笔记本包","qre":"872031"},
  {"key":"笔记本华为","qre":"7400"},
  {"key":"笔记本硬盘","qre":"129374"},
  {"key":"笔记本键盘","qre":"703076"},
  {"key":"笔记本联想","qre":"149953"},
  {"key":"笔记本内存条","qre":"97605"},
];

//1.将商品对象转换为JSON格式的字符串
let json = JSON.stringify(products);
document.write(json+"<br>");
document.write(typeof (json)+"<br>"); 

//2.将JSON格式字符串解析成JS对象
let arr=JSON.parse(json);
for (let p of arr) {
  document.write(p.key+"<br>");
}

10 案例-表单校验(掌握)

//1 给form表单添加一个onsubmit事件
document.querySelector("#regist").onsubmit=function () {
  //2 获取用户名和密码输入框中的内容
  let username = document.querySelector("#username").value;
  let password = document.querySelector("#password").value;

  //3 校验用户名，如果不符合阻止提交,请输入4到16位的纯字母
  let regExp=/^[a-zA-Z]{4,16}$/;
  if(!regExp.test(username)){
    //校验失败
    alert("用户名不符合要求，请输入4到16位的纯字母");
    return false;// 阻止提交
  }
  //4 校验密码，如果不符合阻止提交,请输入6位纯数字的密码
  regExp=/^\d{6}$/;
  if(!regExp.test(password)){
    //校验失败
    alert("密码不符合要求，请输入6位纯数字的密码");
    return false;// 阻止提交
  }
  //return false表示阻止提交，return true表示允许提交，不写默认允许提交
  //5 都符合就允许提交
  return true;
}

BOM对象(了解)

1 window对象

• 一次性定时器

 //定时器
    function fun(){
        alert("该起床了！")
    }
//设置一次性定时器
setTimeout(要执行的代码字符串或者函数对象,毫秒值);
		//let d1 = setTimeout("fun()",2000); //✅
		//let d1 = setTimeout("fun",2000); //❌
    let d1 = setTimeout(fun,2000); //✅
    // let d1 = setTimeout(fun(),2000);  // ❌，立刻调用fun()方法，然后将方法的返回值传递给setTimeout()方法。

//取消一次性定时器
//clearTimeout(d1);

• 循环定时器

//设置循环性定时器
setInterval(要执行的代码字符串或者函数对象,毫秒值);
		//let d1 = setInterval("fun()",2000); //✅
		//let d1 = setInterval("fun",2000); //❌
    let d1 = setInterval(fun,2000); //✅
    // let d1 = setInterval(fun(),2000);  // ❌，立刻调用fun()方法，然后将方法的返回值传递给setInterval()方法。

//取消一次性定时器
//clearInterval(d1);

2 location对象【重要】

​ location表示浏览器地址栏对象，封装了地址栏中的信息，可以通过href属性获取URL或者设置URL路径实现页面跳转。

• href 属性

<body>
  <p>
    注册成功！<span id="spTime">5</span>秒之后自动跳转到首页...
  </p>

</body>
<script>
    //1.定义方法。改变秒数，跳转页面
    let num = 5;
    
    function showTime() {
        num--;

        if(num <= 0) {
            //跳转首页
            location.href = "index.html";
        }

        let span = document.getElementById("time");
        span.innerHTML = num;
    }
    
    //2.设置循环定时器，每1秒钟执行showTime方法
    setInterval("showTime()",1000);
</script>

练习

1.99乘法表

<body>
    <script>
    document.write("<table  align='center'>");
    //1.完成基本的for循环嵌套，展示乘法表
    for (let i = 1; i <= 9 ; i++) {
        document.write("<tr>");
        for (let j = 1; j <=i ; j++) {
            document.write("<td>");
            //输出  1 * 1 = 1
            document.write(i + " * " + j + " = " + ( i*j) +"&nbsp;&nbsp;&nbsp;");
            document.write("</td>");
        }
        document.write("</tr>");
    }
    //2.完成表格嵌套
    document.write("</table>");
</script>
</body>

2.电灯开关

<body>
<div align="center">
    <img src="img/off.gif" id="img">
</div>

<script>
    let img = document.getElementById("img");
    let flag = false;
    img.onclick = function () {
        if (flag){
            img.setAttribute("src","img/off.gif");
            flag=false;
        } else {
            img.setAttribute("src","img/on.gif");
            flag=true;
        }
    }
</script>
</body>

3.轮播图

<body>
<img src="img/banner_1.jpg" id="img" width="100%">
<script>
    let index = 1;
    let img = document.getElementById("img");
    function show() {
        index++;
        if (index>3){
            index=1;
        }
        img.src="img/banner_"+index+".jpg";
    }
    setInterval("show()",2000);
</script>
</body>

4.跳转首页

<body>
<p>
    <div align="center">
    <span id="time">5</span>秒之后自动跳转到首页...
    </div>
</p>
<script>
    let num = 5;
    function fun() {
        num--;
        if (num < 0) {
            location.href="03-轮播图.html";
        }
        let span = document.getElementById("time");
        span.innerHTML = num;
    }
    setInterval("fun()",1000);

</script>
</body>

5.动态表格

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>动态表格</title>
    <style>
        table{
            border: 1px solid;
            margin: auto;
            width: 500px;
        }

        td,th{
            text-align: center;
            border: 1px solid;
        }
        div{
            text-align: center;
            margin: 50px;
        }
    </style>
</head>
<body>
<div>
    <input type="text" id="name" placeholder="请输入姓名" autocomplete="off">
    <input type="text" id="age"  placeholder="请输入年龄" autocomplete="off">
    <input type="text" id="gender"  placeholder="请输入性别" autocomplete="off">
    <input type="button" value="添加" id="add">
</div>

<table id="tb">
    <caption>学生信息表</caption>
    <tr>
        <th>姓名</th>
        <th>年龄</th>
        <th>性别</th>
        <th>操作</th>
    </tr>
    <tr>
        <td>张三</td>
        <td>23</td>
        <td>男</td>
        <td><a href="JavaScript:void(0);" onclick="drop(this)">删除</a></td>
    </tr>
    <tr>
        <td>李四</td>
        <td>24</td>
        <td>男</td>
        <td><a href="JavaScript:void(0);" onclick="drop(this)">删除</a></td>
    </tr>
</table>
<script>
    //一、添加功能
    //1.为添加按钮绑定单击事件
    document.getElementById("add").onclick = function(){
        //2.创建行元素
        let tr = document.createElement("tr");
        //3.创建4个单元格元素
        let nameTd = document.createElement("td");
        let ageTd = document.createElement("td");
        let genderTd = document.createElement("td");
        let deleteTd = document.createElement("td");
        //4.将td添加到tr中
        tr.appendChild(nameTd);
        tr.appendChild(ageTd);
        tr.appendChild(genderTd);
        tr.appendChild(deleteTd);
        //5.获取输入框的文本信息
        let name = document.getElementById("name").value;
        let age = document.getElementById("age").value;
        let gender = document.getElementById("gender").value;
        //6.根据获取到的信息创建3个文本元素
        let nameText = document.createTextNode(name);
        let ageText = document.createTextNode(age);
        let genderText = document.createTextNode(gender);
        //7.将3个文本元素添加到td中
        nameTd.appendChild(nameText);
        ageTd.appendChild(ageText);
        genderTd.appendChild(genderText);
        //8.创建超链接元素和显示的文本以及添加href属性
        let a = document.createElement("a");
        let aText = document.createTextNode("删除");
        /*
            这样写href="JavaScript:void(0)"表示把这个超链接当成一个按钮使用，点击后就不在跳转了
         */
        a.setAttribute("href","JavaScript:void(0);");
        a.setAttribute("onclick","drop(this)");
        a.appendChild(aText);
        //9.将超链接元素添加到td中
        deleteTd.appendChild(a);
        //10.获取table元素，将tr添加到table中
        let table = document.getElementById("tb");
        table.appendChild(tr);
    }
    //二、删除的功能
    //1.为每个删除超链接标签添加单击事件的属性
    //2.定义删除的方法
    function drop(obj){
        //3.获取table元素
        let table = obj.parentElement.parentElement.parentElement;
        //4.获取tr元素
        let tr = obj.parentElement.parentElement;
        //5.通过table删除tr
        table.removeChild(tr);
    }
</script>
</body>
</html>

6.表格全选

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>表格全选</title>
    <style>
        table{
            border: 1px solid;
            width: 500px;
            margin-left: 30%;
        }
        td,th{
            text-align: center;
            border: 1px solid;
        }
        div{
            margin-top: 10px;
            margin-left: 30%;
        }
    </style>
</head>
<body>
<table>
    <caption>学生信息表</caption>
    <tr>
        <th><input type="checkbox" name="cb"></th>
        <th>编号</th>
        <th>姓名</th>
        <th>性别</th>
        <th>操作</th>
    </tr>

    <tr>
        <td><input type="checkbox" name="cb"></td>
        <td>1</td>
        <td>令狐冲</td>
        <td>男</td>
        <td><a href="javascript:void(0);">删除</a></td>
    </tr>

    <tr>
        <td><input type="checkbox" name="cb"></td>
        <td>2</td>
        <td>任我行</td>
        <td>男</td>
        <td><a href="javascript:void(0);">删除</a></td>
    </tr>

    <tr>
        <td><input type="checkbox"  name="cb"></td>
        <td>3</td>
        <td>岳不群</td>
        <td>?</td>
        <td><a href="javascript:void(0);">删除</a></td>
    </tr>
</table>
<div>
    <input type="button" id="selectAll" value="全选">
    <input type="button" id="unSelectAll" value="全不选">
    <input type="button" id="selectRev" value="反选">
</div>
<script>
    document.getElementById("selectAll").onclick =function () {
        let cbs = document.getElementsByName("cb");
        for (let i = 0; i < cbs.length; i++) {
            cbs[i].checked = true;
        }
    };
    document.getElementById("unSelectAll").onclick =function () {
        let cbs = document.getElementsByName("cb");
        for (let i = 0; i < cbs.length; i++) {
            cbs[i].checked = false;
        }
    };
    document.getElementById("selectRev").onclick =function () {
        let cbs = document.getElementsByName("cb");
        for (let i = 0; i < cbs.length; i++) {
            cbs[i].checked = !cbs[i].checked;
        }
    };
</script>
</body>
</html>

7.表单验证

<body>
    
<div class="login-form-wrap">
    <h1>黑马程序员</h1>
    <form class="login-form" action="#" id="regist" method="get" autocomplete="off">
        <label>
            <input type="text" id="username" name="username" placeholder="Username..." value="">
        </label>
        <label>
            <input type="password" id="password" name="password" placeholder="Password..." value="">
        </label>
        <input type="submit" value="注册">
    </form>
</div>
    
    <script>
    //1.为表单绑定提交事件
    document.getElementById("regist").onsubmit = function() {
        //2.获取填写的用户名和密码
        let username = document.getElementById("username").value;
        let password = document.getElementById("password").value;
        //3.判断用户名是否符合规则  4~16位纯字母
        let reg1 = /^[a-zA-Z]{4,16}$/;
        if(!reg1.test(username)) {
            alert("用户名不符合规则，请输入4到16位的纯字母！");
            return false;
        }
        //4.判断密码是否符合规则  6位纯数字
        let reg2 = /^[\d]{6}$/;
        if(!reg2.test(password)) {
            alert("密码不符合规则，请输入6位纯数字的密码！");
            return false;
        }
        //5.如果所有条件都不满足，则提交表单
        return true;
    }
</script>
</body>

8.画鸭子案例

<body>

    <img src="" id="duckimg">

    <input type="button" id="btn" value="开启画鸭子">

    <script>
        document.getElementById("btn").onclick=function () {
            // 启动一个定时器
            timerId = setInterval("showDuck()","1000");
        };
        let index =1;
        function showDuck(){
            document.getElementById("duckimg").src="img/"+index+".png";
            index++;
            if(index==6){
                //关闭定时器
                clearInterval(timerId);
            }
        }
    </script>
</body>

9.动态广告

<body>

    <img src="img/ad_big.jpg" id="ad_big" style="display: none">
    <script>
        // 在页面加载完后 ,三秒显示广告图片
        setTimeout(function(){
            document.getElementById("ad_big").style.display="block";
        },"3000");
        // 在页面 加载完后,六秒隐藏广告图片
        setTimeout(function(){
            document.getElementById("ad_big").style.display="none";
        },"6000");
    </script>

</body>