01jquery事件_页面未加载执行失败(javascirpt匿名事件要卸载加载事件中)

最新推荐文章于 2021-12-17 20:38:18 发布

ginger_mr

最新推荐文章于 2021-12-17 20:38:18 发布

阅读量120

点赞数 1

分类专栏： Callback

本文链接：https://blog.csdn.net/qq_40332952/article/details/104448093

版权

Callback 专栏收录该内容

51 篇文章 2 订阅

订阅专栏

01jquery事件_页面未加载执行失败

解析

执行错误，为什么?因为dom还未加载完毕。
因为javascript代码执行的时候,还没有加载到

click me.

javascript代码就已经执行了所以点击click me.没作用
想要避免这种情况可以将onclick 事件写在javascript页面加载事件中window.onload() = function(){}即可
解决办法：
方式一：将JS代码移到需要操作的html代码后面，一般建议放到body的外面
方式二：将JS代码放到一个页面加载函数中去

代码演示

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<title>页面未加载执行失败</title>
		<script type="text/javascript">
			document.getElementById("panel").onclick = function() {
				alert("元素已经加载完毕 !");
			}
			/*
				执行错误，为什么？
				因为dom还未加载完毕。
			*/
			//解决方法
			/*window.onload = function(){
				document.getElementById("panel").onclick = function() {
				alert("元素已经加载完毕 !");
				}
			}*/
		</script>
	</head>

	<body>
		<div id="panel">click me.</div>
	</body>

</html>

页面展示
错误页面
在这里插入图片描述
点击click me.没作用因为dom还未加载完毕

解决方法
写一个javascirpt页面加载事件

window.onload = function(){
	document.getElementById("panel").onclick = function() {
		alert("元素已经加载完毕 !");
	}
}

ginger_mr

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

专栏目录