2020-11-25 DOM2

最新推荐文章于 2024-09-14 18:52:56 发布

恒睿清（＾ω＾）

最新推荐文章于 2024-09-14 18:52:56 发布

阅读量89

点赞数

分类专栏： javascript 文章标签： javascript

本文链接：https://blog.csdn.net/weixin_51958348/article/details/110140007

版权

javascript 专栏收录该内容

11 篇文章 0 订阅

订阅专栏

当鼠标移动时所在的坐标点

鼠标移动事件

are.onmousemove = function(event){
				console.log(event)

兼容浏览器

event = event || window.event

获取坐标

    var x = event.clientX
	var y = event.clientY

onscroll

当页面滚动到底部时，将input框设置为disabled = false

// 获取p标签 对象
			var info = document.getElementById("info")
			// 获取input标签 数组
			var input = document.getElementsByTagName("input")
			console.log(info,input)
			// 为info绑定一个滚动事件
			info.onscroll = function(){
				if(info.scrollHeight - info.scrollTop == info.clientHeight){
					input[0].disabled = false
					input[1].disabled = false
				}
			}

div跟随鼠标移动

1.获取div盒子

var box = document.getElementById("box")

注册鼠标移动事件

document.onmousemove = function(event){

兼容浏览器

event  = event || window.event

获取鼠标滚动的距离
获取鼠标垂直水平滚动的距离

var t = document.body.scrollTop || document.documentElement.scrollTop
var l = document.body.scrollLeft || document.documentElement.scrollLeft

获取鼠标坐标点 x y

var x = event.clientX
			var y = event.clientY

7.组合坐标设置div元素样式

box.style.left = (l+x)+"px"
			box.style.top = (t+y)+"px"

事件冒泡

1.事件冒泡就是指事件的向上传导，当其后代事件被触发时，其祖先也会被触发

<div id="box">
		<div id="box1"></div>
	</div>
	<script type="text/javascript">
		var box = document.getElementById("box")
		var box1 = document.getElementById("box1")
		box.onclick = function(event){
			event = event || window.event
			alert("这是father")
		}
		box1.onclick = function(event){
			event = event || window.event
			alert("这是son")
			}