当前位置:网站首页>DOM operation
DOM operation
2022-07-06 19:36:00 【wangatong】
use Id
var a = document.getElementById("id name ")
use class What you get is an array
var a = documen.getElementsByClassName("class name ")
What you get with the tag is an array
var a = document.getElementsByTagName (" Tag name ")
use name What you get is an array
var a = document.getElementsByName( "name name " )
With selector querySelectorAll
document.querySelector("p");
event
onmouseover,onmouseout,onclick,
Modify the style
a.style.
Document: The root node
parentNode: Get parent node
childNodes: Get all children
firstChild: First child node
lastChild: The last child node
<p id="p1" class="p1"> Click on </p>
<div id="div1"></div>
<script>
// let p = document.getElementById('p1') //id
// let p = document.querySelector("#p1")
// let p = document.querySelectorAll("#p1")[0]
// let p = document.getElementsByTagName("p")[0] // label
let p = document.getElementsByClassName('p1')[0] //class class
p.onclick = function(){
console.log(111)
}
p.onmouseover = function(){
console.log(222)
}
p.onmouseout = function(){
console.log(333)
}
let div = document.createElement("p") // Create element node
let content = "dfsfsdfsf"
let txt = document.createTextNode(content) // Create text node
div.appendChild(txt) // Add child nodes
let div1 = document.getElementById("div1")
div1.appendChild(div)
// div1.removeChild(div) // Remove node
let val = div.parentNode.getAttribute("id") // Get parent node , Get attribute value
// alert(val)
div.parentNode.setAttribute("name","12") // Set properties
// prompt("What's your name?", "Default")
// var re = confirm(" Delete ?");
// if(re == false){
// console.log('false')
// }else{
// console.log('true')
// }
console.log(navigator.language)
console.log(document.title)
console.log(document.head)
</script>
边栏推荐
- Reflection and illegalaccessexception exception during application
- 打家劫舍III[后序遍历与回溯+动态规划]
- CF960G - Bandit Blues(第一类斯特林数+OGF)
- C # - realize serialization with Marshall class
- Systematic and detailed explanation of redis operation hash type data (with source code analysis and test results)
- An error occurs when installing MySQL: could not create or access the registry key needed for the
- 理解 YOLOV1 第二篇 预测阶段 非极大值抑制(NMS)
- How to customize animation avatars? These six free online cartoon avatar generators are exciting at a glance!
- 黑馬--Redis篇
- 受益匪浅,安卓面试问题
猜你喜欢

通俗的讲解,带你入门协程
Application of clock wheel in RPC

PMP每日一练 | 考试不迷路-7.6

JDBC详解

Mind map + source code + Notes + project, ByteDance + JD +360+ Netease interview question sorting

Interview assault 63: how to remove duplication in MySQL?

Detailed idea and code implementation of infix expression to suffix expression

A popular explanation will help you get started

接雨水问题解析

CPU负载很低,loadavg很高处理方法
随机推荐
PMP practice once a day | don't get lost in the exam -7.6
Yyds dry goods inventory leetcode question set 751 - 760
map的使用(列表的数据赋值到表单,json逗号隔开显示赋值)
swagger2报错Illegal DefaultValue null for parameter type integer
Characteristic colleges and universities, jointly build Netease Industrial College
MySql必知必会学习
【翻译】供应链安全项目in-toto移至CNCF孵化器
[translation] Digital insider. Selection process of kubecon + cloudnativecon in Europe in 2022
MATLAB中deg2rad和rad2deg函数的使用
Black Horse - - Redis Chapter
Leetcode 30. 串联所有单词的子串
Problems encountered in using RT thread component fish
社招面试心得,2022最新Android高频精选面试题分享
A popular explanation will help you get started
Reflection and illegalaccessexception exception during application
深入分析,Android面试真题解析火爆全网
系统性详解Redis操作Hash类型数据(带源码分析及测试结果)
Tensorflow2.0 self defined training method to solve function coefficients
MySQL information schema learning (I) -- general table
short i =1; I=i+1 and short i=1; Difference of i+=1