638_DOM_Document对象_获取Element方法 and _DOM_Document对象_创建DOM对象

DOM_Document对象_获取Element方法

核心DOM模型:

Document:文档对象

  1. 创建(获取):在html dom模型中可以使用window对象来获取

    1. window.document

    2. document

  2. 方法:

    1. 获取Element对象:

      1. getElementById()    : 根据id属性值获取元素对象。id属性值一般唯一

      2. getElementsByTagName():根据元素名称获取元素对象们。返回值是一个数组

      3. getElementsByClassName():根据Class属性值获取元素对象们。返回值是一个数组

      4. getElementsByName(): 根据name属性值获取元素对象们。返回值是一个数组

    2. 创建其他DOM对象:

      createAttribute(name)
                  createComment()
                  createElement()
                  createTextNode()

复制代码
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <!--创建div标签赋值id 加入内容-->
        <div id="d1">div1</div>
        <div id="d2">div2</div>
        <div id="d3">div3</div>

    <!--class标签赋值id-->
        <div class="cls1">div4</div>
        <div class="cls1">div5</div>
    <!--input标签,输入框-->
        <input type="text" name="username">

        <script>
            /*
                Document:文档对象
                    1. 创建(获取):在html dom模型中可以使用window对象来获取
                    1. window.document
                    2. document
                   2. 方法:
                    1. 获取Element对象:
                       1.getElementById():根据id属性值获取元素对象。id属性值一般唯一
                          2. getElementsByTagName():根据元素名称获取元素对象们。返回值是一个数组
                          3. getElementsByClassName():根据Class属性值获取元素对象们。返回值是一个数组
                          4. getElementsByName(): 根据name属性值获取元素对象们。返回值是一个数组
            */
            //根据元素名称获取元素对象。返回值是一个数组
            var div4 = document.getElementById("d");
            //获取数组长度弹窗显示
            //alert(div4,length);

            //根据Class属性值获取元素对象们。返回值是一个数组
            var div_cls = document.getElementsByClassName("cls1");
            //获取数组长度弹窗显示
            //alert(div_cls,length);

            //根据name属性值获取元素对象们。返回值是一个数组
            let use = document.getElementsByName("username");
            alert(use,length);

       //创建一个createElement元素
       var table_v1 = document.createElement("table");
      //获取数组长度弹窗显示
       alert(table_v1); </script>
</script> </body> </html>
复制代码

 


 

posted @   ja不会va  阅读(24)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· 被坑几百块钱后,我竟然真的恢复了删除的微信聊天记录!
· 【自荐】一款简洁、开源的在线白板工具 Drawnix
· 没有Manus邀请码?试试免邀请码的MGX或者开源的OpenManus吧
· 园子的第一款AI主题卫衣上架——"HELLO! HOW CAN I ASSIST YOU TODAY
· 无需6万激活码!GitHub神秘组织3小时极速复刻Manus,手把手教你使用OpenManus搭建本
点击右上角即可分享
微信分享提示