BOM操作

最新推荐文章于 2022-08-01 20:10:35 发布

潇洒（sa）一点

最新推荐文章于 2022-08-01 20:10:35 发布

阅读量1.1k

点赞数 2

文章标签： safari linq wpf

本文链接：https://blog.csdn.net/qq_60281421/article/details/123436130

版权

BOM操作

window对象

基本语法格式如下：

Windows.属性名=”属性值”；

属性：

history：用户访问的统一资源定位符。

Location：当前URL信息。

Screen：只读属性，包含客户端显示屏幕信息。

例如：window.location=”网站”；

Window对象的常用方法。

语法：window.方法名（）;

>alert(); 显示一个带有一个提示信息和一个确定按钮的警告对话框

>confirm(); 显示一个带有消息，”确定”和”取消”按钮的对话框。

>prompt();显示可提供用户输入的对话框。

>open(); 打开一个新浏览器窗口，

>close(); 关闭浏览器出口。

>setInterval(); 间隔指定的毫秒数不停地执行制定代码

>clearInerval(); 用于停止setInterval()方法执行的函数代码。

>setTimeout(); 在指定的毫秒（ms）数后执行指定的代码。

>clearTimeout; 用于停止执行setTimeout()方法的函数代码。

1.Open()

语法：

Window.open([URL,name,specs,replace]);

2.Close()

Window.close();

3.history()

//前进一页

History.go(1) 或 history.forward();

//后退一页

History.go(-1) 或 history.back();

//前进两页

History.go(2)

4.location()

常用的属性是href，达到跳转。

Location.href=”地址”；

5.document()

getElementById(); 返回对拥有的指定id的第一个对象的引用

getElementsByName(); 返回带有指定名称的对象的集合

getElementsByTagName(); 返回带有指定标签名的对象的集合

javaScript定时函数

超时调用

SetTimeout（function(){

Alert(‘你好’)；

}，1000）

（*）设置超时调用

Var timeoutId=setTimeout（function(){

Alert(‘你好！’)；

}，1000）

//取消超时调用

clearTimeOut（timeoutId）；

<body>

<input type="button" value="点击我3秒后电脑爆炸" οnclick="time()">

<input type="button" value="点击我烦死你" οnclick="mmm()">

<input type="button" value="点击进行有次数的显示" οnclick="cccc()">

<script>

    //超时调用

    function time() {

        setTimeout(function () {

            alert("bong")

        },3000)

        //取消超时时间

    }

    //间歇调用

    function mmm() {

        setInterval(function () {

            alert("我又出现了")

        },2000)

    }

    var num=0;

    var max=10;

    var si=null;

    function cccc() {

        function cc() {

            num++;

            alert(num);

            if (num==max){

                //停止调用

                clearInterval(si);

                alert("okok")

            }

        }

        si=setInterval(cc,100);

    }

</script>

间歇调用

SetInterval（function(){

Alert(‘你好’)；

}，3000）

例题，有次数的调用：（10次第11次弹出okok）

var num=0;

var max=10;

var si=null;

function cccc() {

    function cc() {

        num++;

        alert(num);

        if (num==max){

            //停止调用

            clearInterval(si);

            alert("okok")

        }

    }

    si=setInterval(cc,100);

}

Javascript内置对象

Array对象

（1）语法：

Var 数组名称=new Array（size）；

（2）为数组元素赋值：

Var 数组名称=new Array（””,””,””,””）；

（3）常用属性和方法

Length(), 返回数组长度。

Join(); 把数组中的元素放入一个字符串，通过指定的分隔符进行风格。

Sort(); 对数组排序并返回数组

Push(); 向数组末尾添加一个或多个元素，并返回新的长度。

Date对象

Var 日期实例=new Date（参数）；

如果没有参数，则表示当前日期和时间，如：

Var today =new Date（）;

GetDate() 返回Date对象一个月中的每一天

getDay() 返回Date对象星期中的每一天

getHours() 返回Date对象的小时数

GetMinutes() 返回Date对象的分钟数

getSecond() 返回Date对象de 秒数

getMonth() 返回Date对象的月份

getFullYear() 返回Date对象的年份

getTime() 返回自某一时刻

Math对象

Ceil（）对数字进行上舍入

Floor（）对数字进行下舍入

Round（）四舍五入

Random（）返回0~1中的随机数

例题2：修改标签中的字段

<body>
<p id="p">我是一个有id的p标签</p>
<p name="p1">我是p1</p>
<p name="p1">我是p2</p>
<p name="p1">我是p3</p>
<p name="p1">我是p4</p>
<p id="nn"></p>
<input type="button" value="点击我修改" οnclick="a()">
<input type="button" value="点我增加一段文字" οnclick="b()">
<input type="button" value="点击我全部都变" οnclick="c()">
<script>
    function a() {
        document.getElementById("p").innerHTML="我已经被修改";
    }

    function b() {
        var a=document.getElementsByName("p1");
        var str="";
        for (var i = 0; i <a.length; i++) {
            str+=a[i].innerText+" ";
        }
        document.getElementById("nn").innerText=str;
    }

    function c() {
        var xx=document.getElementsByTagName("p");
        for (var i = 0; i <xx.length ; i++) {
            xx[i].innerHTML="我是被getElementsByTagName改变的男人";
        }
    }
</script>

例题3 ：点击移动再点击不移动

<head>

    <meta charset="UTF-8">

    <title>Title</title>

    <style>

先制作一个圆//

        #box{

            width: 100px;

            height: 100px;

            border: 1px solid rgb(83,83,83);

            text-align: center;

            line-height: 100px;

            font-size: 18px;

            border-radius: 50px;

            position: absolute;

            top: 300px;

            left: 100px;

        }

    </style>

编写代码/

</head>

<body>

<div id="box" οnclick="mm()">点击移动</div>



<script>

    var flag=true;

    var i=0;

    function mm() {

        if (flag){

            moven();

            document.getElementById("box").innerHTML="单击停止";

            flag=false;

        }else{

            stop();

            document.getElementById("box").innerHTML="点击移动"

            flag=true;

        }

    }

    function moven() {

        var box =document.getElementById("box");

        //获取样式

        var style=window.getComputedStyle(box);

        var left =parseInt(style.left);

       i= setInterval(c,200);

        function c() {

            left=left+20;

            box.style.left=left+"px";

        }

    }

    function stop() {

        clearInterval(i);

    }

</script>