Chrome控制台 JS调试
Chrome控制台 JS调试的一些小技巧
$
$_命令返回最近一次表达式执行的结果,功能跟按向上的方向键再回车是一样的,但它可以做为一个变量使用在你接下来的表达式中。
$0~$4则代表了最近5个你选择过的DOM节点。在页面右击选择审查元素
,然后在弹出来的DOM结点树上面随便点选,这些被点过的节点会被记录下来,而$0
会返回最近一次点选的DOM结点,以此类推,$1返回的是上上次点选的DOM节点,最多保存了5个,如果不够5个,则返回undefined
。
Chrome 控制台中原生支持类jQuery的选择器,也就是说你可以用$
加上熟悉的css选择器来选择DOM节点
$(selector)返回的是满足选择条件的首个DOM元素。剥去她伪善的外衣,其实$(selector)
是原生JavaScript document.querySelector()
的封装。
同时另一个命令$$(selector)
返回的是所有满足选择条件的元素的一个集合,是对document.querySelectorAll()
的封装。
Copy
通过此命令可以将在控制台获取到的内容复制到剪贴板
因为我刚刚利用控制台选择了一个元素的ID,所以我就用$_,虽然控制台里面输出的是undefined,但是你新建一个记事本,ctrl+c试试,很神奇吧
keys&values
keys返回传入对象所有属性名组成的数据
values返回所有属性值组成的数组
monitor&unmonitor
monitor(function),它接收一个函数名作为参数,每次函数被执行时都会在控制台输出一条信息,里面包含了函数的名称及执行时所传入的参数。
而unmonitor(function)便是用来停止这一监听。
Chrome控制台 JS调试的更多相关文章
- Chrome控制台 JS调试的一些小技巧
$ $_命令返回最近一次表达式执行的结果,功能跟按向上的方向键再回车是一样的,但它可以做为一个变量使用在你接下来的表达式中. $0~$4则代表了最近5个你选择过的DOM节点.在页面右击选择审查元素,然 ...
- chrome 控制台js调试与断点调试
这篇文章是根据目前 chrome 稳定版(19.0.1084.52 m)写的,因为 google 也在不断完善chrome developer tool,所以 chrome 版本不同可能稍有差 ...
- Chrome 控制台 如何调试javascript
上面的文章已经大致介绍了一下console对象具体有哪些方面以及基本的应用,下面简单介绍一下如何利用好chrome控制台这个神器好好调试javascript代码(这个才是我们真正能用到实处的地方) 1 ...
- Chrome控制台毫无反应,打印不出信息了?
最近在使用console.log()方法的时候遇到一个奇怪的问题,打开chrome控制台想调试代码,结果控制台半天无反应,让我纳闷了半天.详情如图所示: 然后我又打开了新的标签页,不行!接着干脆关闭浏 ...
- Chrome 控制台console的用法(学了之后对于调试js可是大大有用的哦)
大家都有用过各种类型的浏览器,每种浏览器都有自己的特色,本人拙见,在我用过的浏览器当中,我是最喜欢Chrome的,因为它对于调试脚本及前端设计调试都有它比其它浏览器有过之而无不及的地方.可能大家对co ...
- 【转】天啦噜!原来Chrome自带的开发者工具还能这么用!(提升JS调试能力的10个技巧)
天啦噜!原来Chrome自带的开发者工具还能这么用! (提升JS调试能力的10个技巧) Chrome自带开发者工具.它的功能十分丰富,包括元素.网络.安全等等.今天我们主要介绍JavaScript ...
- js调试系列: 控制台命令行API
js调试系列目录: - 上次初步介绍了什么是控制台,以及简单的 console.log 输出信息.最后还有两个小问题,我们就当回顾,来看下怎么操作吧. 先打开百度,然后按 F12 打开后,如果不是 C ...
- js调试系列: 初识控制台
写在最开头:其实我以前就在考虑要不要写这个东西,因为这个东西确实不难,但是为什么会有这么多人问,他们问的不是怎么用控制台,而是不知道控制台能干嘛,他们也知道有 console.log 之类的东西,但他 ...
- 如何利用好chrome控制台这个神器好好调试javascript代码
上面的文章已经大致介绍了一下console对象具体有哪些方面以及基本的应用,下面简单介绍一下如何利用好chrome控制台这个神器好好调试javascript代码(这个才是我们真正能用到实处的地方) 1 ...
随机推荐
- 小牟Andorid下面MD5具体实现的思路总结
Android的开发往往需要一定数目demo 从今起MD5一些加密算法提取物 看看是如何实现的 首先,我们必须明确为什么加密? 1 数据安全处理 2 防止数据窃取 3 有效的避免恶意攻击 4 保证文件 ...
- GCD下载图片
cell.myimage.layer.masksToBounds=YES; cell.myimage.layer.cornerRadius=cell.myimage.frame.size.wi ...
- 【Spark亚太研究院系列】Spark道路的真正的主人-第一章 构建Spark星团(第五步)(6)
结束historyserver例如,下面的命令可以看到: 第四步:验证Hadoop分布式集群 首先在hdfs文件系统上创建两个文件夹.创建步骤例如以下所看到的: watermark/2/text/aH ...
- 有关XCode6(iOS8)UITableViewCell与iOS7在UITableViewCell问题
简而言之: iOS6在cell的层次关系2层,但在iOS7层次结构成为3层,但在iOS8的SDK在UITableViewCell层次结构发生了变化2层. 如果它们是UITableViewCell加入到 ...
- 王立平--Button底,点击效果设置
1.新....xml <? xml version="1.0" encoding="utf-8"?> <selector xml ...
- 最具体的历史centos下一个 postfix + extmail + dovecot + maildrop 安装注意事项2014更新
这篇文章原本是2008年发表的,近期几天照此笔记又安装了一遍系统.这里更新一下记录. 作者:wangdy 本文发表于 http://blog.csdn.net/aryang/article/deta ...
- Sqlite学习笔记(四)&&SQLite-WAL原理(转)
Sqlite学习笔记(三)&&WAL性能测试中列出了几种典型场景下WAL的性能数据,了解到WAL确实有性能优势,这篇文章将会详细分析WAL的原理,做到知其然,更要知其所以然. WAL是 ...
- WebAPI上传大文件
今天在研究WebAPI的上传与下载,作为Rest的框架,更多是面向资源,就其本身来说,是不会涉及也不应该涉及到大文件的处理,具体多大呢,也就是ASP.NET的限值2G. ASP.NET的pipelin ...
- (大数据工程师学习路径)第二步 Vim编辑器----高级功能入门
一.多文件编辑 1.使用vim编辑多个文件 编辑多个文件有两种形式,一种是在进入vim前使用的参数就是多个文件.另一种就是进入vim后再编辑其他的文件. 同时创建两个新文件并编辑 $ vim 1.tx ...
- 【剑指offer】最大和连续子阵列
个開始,到第3个为止).你会不会被他忽悠住? 输入: 输入有多组数据,每组測试数据包括两行. 第一行为一个整数n(0<=n<=100000),当n=0时,输入结束.接下去的一行包括n个整数 ...