<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<div id="div1">
</div>
<script type="text/javascript">
// 元素获取
// 都是DOM
// html获取
// 通过id获取元素
// object 对象 万事万物皆对象
var oDiv1 = document.getElementById("div1");
// alert(oDiv1);
// 获取所有div
// a array数组
// 标签名获取元素
var aDiv = document.getElementsByTagName("div");
// alert(aDiv);
// 通过css获取
var oDiv2 = document.querySelector("#div1");
// alert(oDiv2);
var aDiv2 = document.querySelectorAll("div");
// alert(aDiv2);
// 我要做点什么
// 事件绑定
// 简单事件
// 1. 鼠标点击------onclick
oDiv1.onclick = function(){
// alert("恭喜你点击绑定成功");
oDiv1.style.backgroundColor = "blue";
oDiv1.style.transform = "translate(100px, 100px)";
};
// 2. 鼠标移入----onmouseover
oDiv1.onmouseover = function(){
// alert("鼠标移入")
};
// 3. 鼠标移出效果----onmouseout
oDiv1.onmouseout = function(){
// alert("鼠标移出");
};
</script>
</body>
</html>
1579
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
