一个小错误的debug过程

最新推荐文章于 2021-01-18 23:57:59 发布

luuquanwei

最新推荐文章于 2021-01-18 23:57:59 发布

阅读量343

点赞数

分类专栏：读书感想

本文链接：https://blog.csdn.net/u013649139/article/details/40472609

版权

读书感想专栏收录该内容

2 篇文章 0 订阅

订阅专栏

实例代码：

HTML:

<div id="messageArea"></div>

CSS:

div#messsageArea {
		position:absolute;
		top:0px;
		left:0px;
		color:rgb(83,175,19);
}

JAVASCRIPT:

var view = {
	displayMessage:function(msg) {
		var messageArea = document.getElementById("messageArea");
		messageArea.innerHTML = msg;
	},
	displayHit:function(location) {
		var cell = document.getElementById(location);
		cell.setAttribute("class","hit");
	},
	displayMiss:function(location) {
		var cell = document.getElementById(location);
		cell.setAttribute("class","miss");
	}
};

view.displayMiss("00");
view.displayHit("34");
view.displayMiss("55");
view.displayHit("12");
view.displayMiss("25");
view.displayHit("26");

view.displayMessage("Hello");

bug:最后一句代码view.displayMessage("Hello");不起效果。

troubleshoot过程：

1、更换浏览器（不行）

2、怀疑JS拼写错误，将method，id复制粘贴（不行）

3、使用google浏览器查看html，发现div中正常输出Hello。

4、又花了很长时间看html,js

5、偶然看到css，发现id错误，恍然大悟。

总结：

在第3步的时候就应该知道是CSS出问题了，思考问题时思路还不够清晰。