元素对象理解
2019-08-25 本文已影响0人
Artifacts
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
#box{
width: 200px;
height: 200px;
border: 3px solid lightblue;
}
.AA{
background: lightcoral;
}
</style>
</head>
<body>
<div id="box"></div>
<script>
let box = document.getElementById('box');
// =>通过方法获取元素是对象数据类型的值
// console.log(typeof box); //=>"object"
//=>使用.dir可以看一个对象的详细信息
/*
*id:操作元素的ID值
*className: 操作元素的CLASS样式类的值
*innerHTML: 操作元素内容（可以识别标签）
*innerText: 操作元素内容（不可以识别标签）
*tagName:获取元素的标签名（一般大写）
* ......
* style:操作元素的行内样式 属性值是一个新的对象
* （CSSStyleDeclaration）
*/
console.dir(box);
// box.style.display
// box['onclick']=function(){
// };
</script>
</body>
</html>
