Javascript怎么能找出出错在哪里呢?

2012-03-27 17:35:08 +08:00
 binarymann
Javascript实在太不newbie-friendly了,照着书上写了个计算器,对着看了N遍没有一个错误但就是运行不起来,也不报错,打开chrome的developer tool切换到script标签啥都看不到...

作为第一门语言学习是不是得换门语言啊,譬如Python?

<!DOCTYPE html>

<html>
<head>
<title></title>
<style type="text/css">
td {
border: 1px solid gray;
width: 50px;
}
#results {
height: 20px;
}
</style>
</head>
<body>
<table border="0" cellpadding="2" cellspacing="2">
<tr>
<td colspan="4" id="result"></td>
</tr>
<tr>
<td><a href="#">1</a></td>
<td><a href="#">2</a></td>
<td><a href="#">3</a></td>
<td><a href="#">+</a></td>
</tr>
<tr>
<td><a href="#">4</a></td>
<td><a href="#">5</a></td>
<td><a href="#">6</a></td>
<td><a href="#">-</a></td>
</tr>
<tr>
<td><a href="#">7</a></td>
<td><a href="#">8</a></td>
<td><a href="#">9</a></td>
<td><a href="#">*</a></td>
</tr>
<tr>
<td><a href="#">Clear</a></td>
<td><a href="#">0</a></td>
<td><a href="#">=</a></td>
<td><a href="#">/</a></td>
</tr>
</table>
<script type="text/javascr ipt">
//using early dom event handlers
function addDigit(digit){
var resultField = document.getElementById("result");
resultField.innerHTML += digit;
return false;
}
function calculate(){
var resultField = document.getElementById("result");
resultField.innerHTML = eval(resultField.innerHTML);
return false;
}
function clear(){
var resultField = document.getElementById("result");
resultField.innerHTML = "";
return false;
}
function getHandlerFunction(innerHTML){
return function(){
addDigit(innerHTML);
return false;
};
}

onload = function() {
var links = document.getElementsByTagName("a");
var length = links.length;

for (var i = 0; i < length; i ++) {
var link = links[i];
var innerHTML = link.innerHTML;

switch(innerHTML) {
case "Clear":
link.onclick = clear;
break;
case "=":
link.onclick = calculate;
break;
default:
link.onclick = getHandlerFunction(innerHTML);
break;
}
}
};

</script>
</body>
</html>
4188 次点击
所在节点    问与答
24 条回复
icyflash
2012-03-27 17:39:22 +08:00
切到 console
binarymann
2012-03-27 17:44:18 +08:00
@icyflash 切到console了一片空白要如何调试呢?可以将我上面的代码全部复制粘贴到console里面运行不(貌似不行,刚试过了)
lackrp
2012-03-27 17:47:37 +08:00
<script type="text/javascr ipt"> 这句话多了个空格
jiyinyiyong
2012-03-27 17:48:47 +08:00
`<script type="text/javascr ipt">`中间去掉多余空格,, 然后我这边能运行了...
好像 HTML 当中的 script 不会显示到 script 里面的, 要单独文件才那个.
JS 感觉因为浏览器环境太复杂才有问题.. 换成 Node 的话感觉和 Python 至少入门不差太多..
如果有机会楼主来玩 CoffeeScript 吧..
icyflash
2012-03-27 17:49:27 +08:00
你这个是onload的原因, 换成window.onload
icyflash
2012-03-27 17:54:59 +08:00
你代码没错,所以捕捉不到,只是按钮点击后没反应,你该考虑下是不是事件没绑定。

你用 onload,代码是没错的,但仅仅只是定义了一个函数,没将它绑定到对象上。
binarymann
2012-03-27 17:56:24 +08:00
@lackrp
@jiyinyiyong
@icyflash

感谢你们!怎么跑了个空格进去...但不报错的确太难找了...

@jiyinyiyong
coffeescript看起来很不错,但是还是需要js的背景知识才能学习吧?
jiyinyiyong
2012-03-27 18:05:01 +08:00
@binarymann JS 我比较菜, 只是玩的话 CoffeeScript 直接学也是可以的
另外, 比方说网上的文档基本是用 JS 写的, 那当然要熟悉 JS 啦才能懂了
先后顺序我没试过, 估计影响不大, 因为 coffee 本身也能当一门语言了
.. 就是不能浏览器直接 REPL 运行, 自己配环境入门的时候有点烦
zephyro
2012-03-27 18:10:31 +08:00
前几天使用vim+chrome开发html5小游戏,找着bug一个晚上晃晃悠悠地就过去了... ...各种alert加输出,最后总是超低级的无聊错误。
我记得有浏览器运行的时候会报错的,第几行第几个字符缺少定义什么的。
我的ie是有的,chrome和firefox是不是有插件可以辅助开发。
gDD
2012-03-27 18:12:16 +08:00
@zephyro 看一楼。
cmonday
2012-03-27 18:15:14 +08:00
@zephyro 你竟然用IE做前端开发,效率得有多低……
cmonday
2012-03-27 18:17:29 +08:00
Javascript在浏览器环境下会碰到很多意料之外的问题,确实不是很适合新手。不过如果LZ想学前端相关的知识,我倒是有一个建议,就是直接从学习jQuery开始入门
icyflash
2012-03-27 18:26:48 +08:00
呃,我弄错了,onload是可以的。一直用jquery,JS基础还是太差了。
reus
2012-03-27 18:34:53 +08:00
表……表格布局!
感觉这书不靠谱啊
reus
2012-03-27 18:35:47 +08:00
哦是计算器,我错了(脸红地匿
Livid
2012-03-27 19:21:36 +08:00
leecade
2012-03-27 19:29:59 +08:00
呵呵,来吓吓你:

猜你不知道的JavaScript, Part I: operator
http://www.jsser.com/t/21
iwege
2012-03-27 19:32:36 +08:00
script为了减少错误,最好不要写type..或者是使用自动生成。
另外新版chrome的inspector很强,基本上等价于编辑器了,Scripts的tab,对于页面内嵌的script它可以抽出来作为单个script内容,也可以通过那个检查是否已经作为Script来执行了。同时也自带代码格式化工具,可以将任何恶心的代码格式化。
likuku
2012-03-27 20:21:25 +08:00
JS太难了,python入门蛮好的
benzhe
2012-03-27 20:30:00 +08:00
选一个合适的IDE吧,比如netbeans,以上错误它会毫不客气的告诉你

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/30680

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX