美文网首页
JavaScript--BOM对象

JavaScript--BOM对象

作者: 何以解君愁 | 来源:发表于2022-07-12 17:24 被阅读0次
window:
    window:浏览器窗口对象
    获取:直接使用window,其中window.可省略(window.alert("q");)
    属性:获取其他BOM对象
        history:对History对象的只读引用(使用window.history获取,window.可省略)
        (window.history.方法())(方法:back()加载history列表中的前一个url,forward()加载history列表中的下一个url)
        Navigator:对Navigator对象的只读引用
        Screen:对Screen对象的只读引用
        location:用于窗口或框架的Location对象
    方法:
        alert():显示带有一段消息和一个确认按钮的警告框
        conflrm():显示带有一段消息以及确定按钮和取消按钮的话框
        setInterval():按照指定的周期(以毫秒计)来调用函数或计算表达式
        setTimeout():在指定毫秒数后调用函数或计算表达式

      setTimeout(function,毫秒值):在一定的时间间隔后执行一个function,只执行一次
      setInterval(function,毫秒值):在一定的时间间隔后执行一个function,循环执行
<script>
    // alert("a");

    var flag = confirm("是否确认");

    // if (flag){
    //     alert("√");
    // }else {
    //     alert("×");
    // }

    //定时器
    /**
     * setTimeout(function,毫秒值):在一定的时间间隔后执行一个function,只执行一次
     * setInterval(function,毫秒值):在一定的时间间隔后执行一个function,循环执行
     */

    setTimeout(function (){
        alert("hehe");
    },1300);

    setInterval(function (){
       alert(3);
    },1000)
</script>
JavaScript通过DOM,对HTML进行操作:
    改变HTML元素的内容
    改变HTML元素的样式
    对HTMLDOM事件作出反应
    增添和删除HTML元素

DOM是w3c的标准
Document Object Model:文档对象模型
DOM定义了访问HTML和XML文档的标准:
①核心DOM:针对任何结构化文档的标准模型
(将标记语言的各个组成部分封装成对象)
Document:整个文档对象
Element:元素对象
Attribute:属性对象
Text:文本对象
Comment:注释对象
②XML DOM:针对XML文档标准模型
③HTML DOM:针对HTML文档的标准模型
image:<img>
Button:<input type='button'>

获取Element:
    获取:使用Document对象的方法来获取
    ①getElementById:根据id属性值获取,返回一个Element对象
    ②getElementByTagName:根据标签名属性值获取,返回一个Element对象数组
    ③getElementByName:根据name属性值获取,返回一个Element对象数组
    ④getElementsByClassName:根据class属性值获取,返回Element对象数组
灯泡颜色改变:
var img = document.getElementById("sss");
    // alert(img);
    //设置img值
    img.src = "../../img/test1.png"


var divs = document.getElementsByTagName("div");

    //style:设置元素css样式   innerHTML:设置元素内容
    for (let i = 0; i < divs.length; i++) {
        divs[i].style.color = 'red';
        divs[i].innerHTML = "衡";
    }


var ss = document.getElementsByClassName("s");
    for (let i = 0; i < ss.length; i++) {
        //checked:全部选中
        ss[i].checked = true;
    }

相关文章

网友评论

      本文标题:JavaScript--BOM对象

      本文链接:https://www.haomeiwen.com/subject/cbmavrtx.html