为了账号安全,请及时绑定邮箱和手机立即绑定

html和js前后顺序调换后js失效

	<h2 id="con">I LOVE JAVASCRIPT</h2>
	<p> JavaScript使网页显示动态效果并实现与用户交互功能。</p>
	<script type="text/javascript">
		var mychar = document.getElementById("con");
		mychar.style.color = "red";
	</script>

这样写可以实现。

	<script type="text/javascript">
		var mychar = document.getElementById("con");
		mychar.style.color = "red";
	</script>
	<h2 id="con">I LOVE JAVASCRIPT</h2>
	<p> JavaScript使网页显示动态效果并实现与用户交互功能。</p>

这样就不行,为什么?

正在回答

4 回答

这算是基本常识吧,正常情况下,代码是从上往下运行的

0 回复 有任何疑惑可以回复我~

window.onload或者将scripy部分放在body区域的最后边也可以


0 回复 有任何疑惑可以回复我~

同楼上。浏览器的代码执行会按照顺序从上往下执行。第二种方法中,你的id为con的元素即h2并没有开始创建,此刻你得到的“con”是一个空对象(null),没有对象当然就无法执行。把<script>标签写在html元素的最后(</body>)之前,除了可以SEO优化以外,还有个好处就是不会出现上述情况

0 回复 有任何疑惑可以回复我~

下面那种写法,执行js的时候h2还没创建,所以没效果。把js操作放在函数里,点击调用应该可以,你试试。

0 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消
JavaScript进阶篇
  • 参与学习       468295    人
  • 解答问题       21893    个

本课程从如何插入JS代码开始,带您进入网页动态交互世界

进入课程

html和js前后顺序调换后js失效

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信