为什么没有输出九九乘法表?

下面的程序本来想输出九九乘法表到屏幕上,为什么没有输出呢?怎样修改?

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8" />

<title>我的HTML练习</title>

<!--preload-links-->

<!--app-context-->

</head>

<body>

<div id="jiujiubiao">

<script>

for(var a=1;a<=9; a++){

for(var b=1;b<=a;b++){

document.write(b+"*"+a+"="+a*b+"&nbsp"+"&nbsp"+"&nbsp"+"&nbsp");

}

document.write("<br />")

}

</script>

</div>

</body>

</html>

经过查询,解决办法如下:

你的程序没有打印内容的原因是因为你将九九乘法表的内容写在了<script>标签内部,而应该将它写在<div>标签内部。

请将<script>标签内的代码移动到<div>标签内的位置,然后再运行程序。

修改后的代码如下所示:

复制代码
<html>
	<head>
		<meta charset="utf-8" />
		<title>我的HTML练习</title>
		<!--preload-links-->
		<!--app-context-->
	</head>
	<body>
		<div id="jiujiubiao">
			<script>
			for(var a=1;a<=9; a++){
				for(var b=1;b<=a;b++){
					document.write(b+"*"+a+"="+a*b+"&nbsp"+"&nbsp"+"&nbsp"+"&nbsp");
				}
				document.write("<br />")
			}	
			</script>
		</div>
	</body>
</html>

上面说的要移动到<div>内部,实际给出的结果却没有移动出来。你试试看。

实际上,问题的原因是<script/>放置的位置不对,应该在<head>内部,放在其他地方的《script》会被解释器忽略。

修改办法是将JavaScript代码放在页面加载完成后执行,可以将代码放在<body>标签的末尾,或者使用window.onload事件来确保页面加载完成后再执行JavaScript代码。可以将你的代码修改为以下形式:

<html>

<head>

<meta charset="utf-8" />

</head>

<body> <div id="jiujiubiao"></div>

<script> window.onload = function () { var div = document.getElementById("jiujiubiao"); for (var a = 1; a <= 9; a++) { for (var b = 1; b <= a; b++) { div.innerHTML += b + "*" + a + "=" + a * b + "&nbsp" + "&nbsp" + "&nbsp" + "&nbsp"; } div.innerHTML += "<br />"; } } </script> </body> </html>

这样修改后,页面加载完成后,JavaScript代码会将结果输出到id为jiujiubiao的div中。

相关推荐
Definition3 分钟前
Claude Code 能养宠物了,体验下抽卡的感觉
前端·程序员
Daiyaosei8 分钟前
紧急安全警报:Axios npm 包被投毒事件详解与防护指南
前端·javascript·安全
We་ct13 分钟前
LeetCode 295. 数据流的中位数:双堆解法实战解析
开发语言·前端·数据结构·算法·leetcode·typescript·数据流
青槿吖16 分钟前
第一篇:Redis集群从入门到踩坑:3主3从保姆级搭建+核心原理一次性讲透|面试必看
前端·redis·后端·面试·职场和发展·bootstrap·html
迷藏49417 分钟前
**雾计算中的边缘智能:基于Python的轻量级任务调度系统设计与实现**在物联网(IoT)飞速发展的今天,传统云
java·开发语言·python·物联网
美狐美颜sdk26 分钟前
2026主流直播美颜sdk对比:效果、算法与成本分析
前端·人工智能·计算机视觉·美颜sdk·直播美颜sdk·第三方美颜sdk·视频美颜sdk
大鹏说大话26 分钟前
MySQL与PostgreSQL:底层架构差异与项目选型指南
开发语言
王霸天28 分钟前
🚨 还在用 rem) 做大屏适配?用 vfit.js 一键搞定,告别改稿8版的噩梦!
前端·vue.js·数据可视化
文心快码BaiduComate42 分钟前
Comate AI IDE三大能力升级:支持语音输入& AI可操作浏览器 & Figma设计与代码双向转换
前端·后端·程序员
番茄去哪了1 小时前
任务调度功能实现
java·开发语言·spring boot