有几个巨头公司,即Facebook和Netflix,决定禁止用户在控制台(console)执行JavaScript命令。 最初这是 由Facebook开始的 ,用于防止恶意用户通过JavaScript控制台执行特定的命令散播消息(发送给所有Facebook用户大量垃圾信息)。 当然这受到很多指责,但在我参与之前, 他们使用的代码 如下所示: 代码如下: // 看起来 Netflix 似乎是唯 Facebook 马首是瞻 [https://news.ycombinator.com/item?id=7222129]. (function() { try { var $_c...
反正只要 JavaScript 出错后刷新不复现,那用户就可以通过刷新解决问题,浏览器不会崩溃,当没有发生过好了。这种假设在 Single Page App 流行之前还是成立的。现在的 Single Page App 运行一段时间后状态复杂无比,用户可能进行了若干输入操作才来到这里的,说刷新就刷新啊?之前的操作岂不要完全重做?所以我们还是有必要捕获和分析这些异常信息的,然后我们就可以修改代码避免影响用户体验。捕获异常的方式 我们自己写的 throw ...
一、什么是console.log()?除了一些很老版本的浏览器,现今大多数浏览器都自带调试功能;即使没有调试功能,也可以通过安装插件来进行补充。比如,老版本的Firefox没有自带调试工具,在这种情况下可以通过安装Firebug插件来添加调试功能。在具备调试功能的浏览器上,window对象中会注册一个名为console的成员变量,指代调试工具中的控制台。通过调用该console对象的log()函数,可以在控制台中打印信息。比如,以下代码将在控制台中...
有的同学会说,可以使用源代码搜索的办法。的确,对于一个相对简单的页面,这个方法时常奏效。但是,对于构成相对复杂的页面(比如页面嵌入很多脚本文件和片段、使用了大段面向对象的实现、隐藏了实现的代码),可能找起来就不那么顺利了。 在Javascript调试中,我们经常会使用到断点调试。其实,在DOM结构的调试中,我们也可以使用断点方法,这就是DOM Breakpoint(DOM断点)。 具体的使用方法: 1. 在Chrome浏览器中,打开开发者工...
现在我们介绍一种在Node下检查简单错误的JS代码验证工具JSHint。JSHint的具体介绍参考http://www.jshint.com/about/,说直白点儿,JSHint就是一个检查JS代码规范与否的工具,它可以用来检查任何(包括server端和client端)地方的JS代码的规范性。它提供了配置的方法,从而让开发者自己来定义检查哪些规范上的错误。这就给开发者带来了很大的便利性,因为在开发过程中,尤其是在团队开发过程中会经常遇到各种各样因不符合规范而带来...
写在最开头:其实我以前就在考虑要不要写这个东西,因为这个东西确实不难,但是为什么会有这么多人问,他们问的不是怎么用控制台,而是不知道控制台能干嘛,他们也知道有 console.log 之类的东西,但他们不知道为什么要用这么长的字符串代替 alert 输出信息。在他们眼里 alert 足以。好吧,我承认小小的吐槽了下,不过这个系列我只打算介绍下调试的基本知识,不会涉及太深,因为深入的东西结合js知识,如果你js没到一个境界,我就算...
先打开百度,然后按 F12 打开后,如果不是 Console 项的就点击 Console 这项,因为我们要在控制台操作。。 看到如下内容:好了我们先清空内容,可以右击选 Clear console 菜单,或者输入 clear() 都行。 接着,我们输入 document.getElementById('kw1'); 然后回车,就可以看到 id 为 kw1 的元素信息了。是不是很简单。下一步是用 console.dir 查看该元素信息。 输入 console.dir(document.getElementById('kw1')); 然后回车,出来一...
我们先来处理第一个问题:1. 查看文章下方 推荐 这个功能所调用的函数源码 其实非常简单,点放大镜选中那个推荐即可。这个 votePost(cb_entryId,'Digg') 就是推荐按钮所调用的函数了,是不是非常简单。 第二个问题,定位到函数所在文件位置。 其实也是非常简单的,当然,不熟悉控制台的朋友也许不知道怎么看。 我在控制台输入 votePost 然后回车,函数源码粗显啦,并且在右下角有个链接 blog-common.js?v=WE8o1xrgcTu07QVvwYqERq...
上几篇文章已经为大家介绍了js调试系列的一些基础知识,这次乱码兄弟为大家带来了js断点与动态调试方法,需要的朋友可以参考下 昨天留的课后练习 1. 分析 votePost 函数是如何实现 推荐 的。 其实我们已经看到了源码,只要读下源码即可知道他是怎么实现的了。function votePost(n, t, i) { i || (i = !1); var r = { blogApp: currentBlogApp, postId: n, voteType: t, isAbandoned: i }; $("#digg_tips").css("color", "red").htm...
第一步:在需要打断点处写上 debugger;第二部:在IE中将禁用脚本调试的钩去掉 打开IE -> 工具 -> 选项 -> 高级 -> 去掉禁用脚本调试(Internet Explorer)和禁用脚本调试(其他)不用调试时记得将IE去掉的钩,钩上,以免打开其它网页报错!
我之前在调试代码的时候,跟砸js代码执行情况,一般都是通过在代码块中使用alert的方式查看js代码的执行情况,今天也是看到有朋友使用console.log函数打印输出函数,变量,对象,下边就console.log的使用情况进行记录,具体的语法是:console.log("值为:",fn);console.log()能够输出变量,函数,数组,对象等等this关键字_函数调用 var testobj = { 'id': 1, 'content': 'test', 'firstname': function() { var EleFirst= document.getEl...
用CONSOLE.LOG()展示数组 想象下你构造了如下数组 var languages = [ { name: "JavaScript", fileExtension: ".js" }, { name: "TypeScript", fileExtension: ".ts" }, { name: "CoffeeScript", fileExtension: ".coffee" } ]; console.log(languages); console.log() 会这样展示数组这样的展示形式对于开发很有用,但是我发现这样还要手动去点每个Object有些笨重。这时候我觉得console.table()有点意思。 用CONSOLE.TABLE()展示数...
一、显示信息的命令代码如下:常用console命令console.log('hello'); console.info('信息'); console.error('错误'); console.warn('警告');最常用的就是console.log了。二:占位符 console上述的集中度支持printf的占位符格式,支持的占位符有:字符(%s)、整数(%d或%i)、浮点数(%f)和对象(%o)代码如下:console.log("%d年%d月%d日",2011,3,26);效果:三、信息分组代码如下:常用console命令console.group("第一组信息");cons...
最近在一个新的web项目中开发功能。这个项目的管理界面有一个特点,框架是固定的,不会刷新,每次点新的页面仅仅刷新一个div。div里面不是套的iframe,于是导致了一个问题,用浏览器无法调试异步加载页面里包含的js文件。简单的说就是在调试工具里面看不到异步加载页面里包含的js文件。 网上找到了一个解决办法,就是在需要调试的js文件顶部加一行代码: //@ sourceURL=msgprompt.js 注意,@符号和sourceURL间必须有空格。Chrome下...
你是怎么调试 JavaScript 程序的?最原始的方法是用 alert() 在页面上打印内容,稍微改进一点的方法是用 console.log() 在 JavaScript 控制台上输出内容。嗯~,用这两种土办法确实解决了很多小型 JavaScript 脚本的调试问题。不过放着 Chrome 中功能越发强大的开发者工具不用实在太可惜了。本文主要介绍其中的 JavaScript断点设置和调试功能,也就是其中的 Sources Panel(以前叫 Scripts)。如果你精通 Eclipse 中的各种 Java 调试...