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

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

<!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中。

相关推荐
神の愛5 小时前
左连接查询数据 left join
java·服务器·前端
t***5445 小时前
如何配置Orwell Dev-C++使用Clang
开发语言·c++
CoderCodingNo5 小时前
【信奥业余科普】C++ 的奇妙之旅 | 13:为什么 0.1+0.2≠0.3?——解密“爆int”溢出与浮点数精度的底层原理
开发语言·c++
小码哥_常7 小时前
解锁Android嵌入式照片选择器,让你的App体验丝滑起飞
前端
kongba0077 小时前
项目打包 Python Flask 项目发布与打包专家 提示词V1.0
开发语言·python·flask
froginwe117 小时前
C 语言测验
开发语言
今夕资源网7 小时前
powershell工具包 安装升级脚本并设置UTF-8 环境快捷方式创建 将powershell的编码默认改为UTF-8
开发语言·utf-8·powershell·utf-8编码·powershell7·powershell5·设置utf-8编码
郑寿昌7 小时前
IIoT本体迁移的领域扩展机制
服务器·前端·microsoft
机器视觉知识推荐、就业指导8 小时前
Qt:真正的门槛不是入门,而是维护
开发语言·qt
深海鱼在掘金8 小时前
Next.js从入门到实战保姆级教程(第十一章):错误处理与加载状态
前端·typescript·next.js