8.6笔记

获取标签得属性

第一种方式：元素名，属性名

第二种方式先找到标签，第二步才获取到该标签得属性

   var input = document.getElementById("user")
        console.log(input.value, input.type)
            //更改属性值
        input.value = "用户名"
            //自定义属性 
        var div1 = document.getElementById("div1")
            //getElementById()获取标签的属性的值(也包括一些自定义属性的值)
        console.log(div1.getAttribute("stuname"))
        console.log(div1.getAttribute("class"))
        div1.setAttribute("stuid", "1001")
            //自定义属性data-***
            //dataset只能读取到data的属性
        console.log(div1.dataset)
        console.log(div1.dataset.index)
        console.log(div1.dataset["data-lianghaoyu"])

 console.log(input.value, input.type)

更改属性值

 input.value = "用户名"

自定义属性

getElementById()获取得标签属性得值（也包括一些自定义属性得值）

自定义属性data*****

datasset只能读取到data得值

添加删除

    <input type="button" value="添加" id="a" onclick="Add()">
    <input type="button" value="删除" id="b" onclick="Del()">
    <input type="button" value="修改" id="c" onclick="Xdd()">
    <ul>
        <li>1</li>
        <li>2</li>
        <li>3</li>
        <li>4</li>
        <li>5</li>
    </ul>
    <script>
        function Add() {
            var ul = document.querySelector("ul") //获取ul标签
                //创建一个节点
            var li = document.createElement("li")
            li.innerHTML = "这是新添加的"
            ul.appendChild(li) //向标签内追加子元素
        }

        function Del() {
            //删除接节点 removeChild()
            //先获取到要删除的标签再用removeChlid()
            var ul = document.querySelector("ul") //获取ul标签
            var li = ul.firstElementChild
            ul.removeChild(li)
        }

        function Xdd() {
            var ul = document.querySelector("ul")
            var li = ul.firstElementChild

            li.innerHTML = "<a href=#>这是改后的</a>"
        }
    </script>

 删除节点removeChild()

先获取到要删除得标签再用removeChild()

1.获取ul标签

2.创建一个节点

3.像标签内追加子元素

dom

1.获取dom中得节点，使用document对象

获取整个文档

 console.log(document.documentElement)
        //  获取头部
    console.log(document.head)
        // 获取body
    console.log(document.body)

通过函数来获取函数

getElementByid()通过标签得id属性的值获取到某个标签

getElementsByClassName()根据标签的class属性值来获取一组标签

querySelector()根据选择器名称来获取满足条件的并且时遇到的第一个标签

预解析

声明式得函数解析时,整个函数将被提升到script标签得最上面

赋值式得函数解析时，将赋值得变量提升到script标签得最上面

后面的赋值默认忽略

       

变量预解析，将声明的变量提升至script的最上面

    由于变量的预解析，此处打印的时undefine