Dom

// document.getElementById();             // document.getElementsByClassName();             // document.getElementsByName();             // document.getElementsByTagName();
            // document.querySelector();对象             // document.querySelectorAll();数组
            // var li=document.querySelector("#li1");             // li.parentElement.style.color="red";             // console.log(li.parentElement)             // console.log(li.parentNode)                         // var ul=document.querySelector("ul");             // console.log(ul.children) 文本节点             // console.log(ul.childNodes) 不包括文本节点             // var li =document.querySelector("#li1");             // console.log(li.nextElementSibling)             // console.log(li.previousElementSibling)
            //样式 style             // var li =document.querySelector("#li1");             // li.style.color="red";             // 不能用  ‘ - ’  链接(去掉‘ - ’,在原‘ - ’后面的首字母大写)  驼峰命名法             // li.style.backgroundColor="#333";             // li.style["background-color"]="#333";                         //属性 attributes (作用于非原始属性)             // console.log(li.id);             // console.log(li.className);             //console.log(li.dataId);不行             // console.log(li.attributes["data-id"].name) name获取的是名字 value获取的是值             // console.log(li.attributes["id2"])
            // 事件 (事件名称前加on)             //* click 点击             //* change 单选,多选状态改变 下拉框选项改变 文本框的值改变             //* mouseover             //* mouseout             // keydown             //* keypress             // keyup             // var btn=document.querySelector("button")             // btn.onclick=function(){                 //console.log(this.value) // 交互控件的值             // }             // var li=document.querySelector("li1")             // li.onclick=function(){                 //console.log(this.innerText);//获取内容                 //console.log(this.innerHTML);//获取标签内所有内容                 //console.log(this.outerText);//含有本身             // }             var select=document.querySelector("select");             // select.onclick=function(){             //     console.log(this.value);             // }             select.onchange=function(){                 console.log(this.value);             }
上一篇:JS 获取没有特定class的标签


下一篇:JSwebAPIs选择器以及操作元素属性和样式