Chrome 小技巧
时间:2022-07-25
本文章向大家介绍Chrome 小技巧,主要内容包括其使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。
记录log中的值到一个临时变量中
通常我们在chrome
的devtools
的工具中使用console.log
来打印一些值,有时候是一个对象.但是我们想对这个值进行一个后续的操作,比如json
转字符串,或者字符串的筛选操作,我们可以使用下面的操作自动创建一个临时变量进行保存
选中log输出的值,鼠标右键,保存为全局变量.自动会赋值给一个tmp
的变量,序号是变量的个数.然后我们就可以使用tmp
变量来代替log中的值来进行一些操作了.
使用快捷键
ctrl + L
: 可以对控制台进行清屏
鼠标聚焦到浏览器中,使用 ctrl + L
可以聚焦到url
栏
alt + enter
: 新窗口打开当前标签页,前提是已经聚焦到了url
上,可以配合 ctrl +L alt + enter
使用
ctrl + shift + c
: 呼出选择dom
元素的工具
ctrl + shift + m
: 切换设备类型
esc
: 在控制台中,使用 esc
可以再打开一个控制台,再次使用则关闭
复制控制台的一些内容到系统粘贴板
使用 copy
复制某个对象或对象的某些元素到粘贴板
{
"name": "lili",
"age": 18
}
模拟各种网络条件
在devtools
的网络工具中,提供了几种默认的上网方式
- 在线. 2. 离线. 3. 3G快速. 4. 3G慢速. 自定义
打印输出为表格形式
console.table([{name:"lili",age:18},{name:"lisa",age:19}])
引用所选dom节点
当我们使用devtools中的工具选中了一个页面元素后,当前元素对象会被赋值为 0,我们可以使用0来获取dom的一些属性
- 《大型网站技术架构》学习笔记-02架构篇
- POJ2488-A Knight's Journey(DFS+回溯)
- FreeMarker快速入门
- 用只含一个链域的节点实现循环链表的双向遍历
- 亚马逊注册3个新域名引发预测,或成为最大数字货币交易所
- POJ-1979 Red and Black(DFS)
- 06-图2 Saving James Bond - Easy Version
- 06-图1 列出连通集
- Bootstrap快速入门
- 常用工具(Windows版本)
- Hadoop快速入门
- Lake Counting(POJ-2386)
- Vue快速入门
- 04-树6. Huffman Codes--优先队列(堆)在哈夫曼树与哈夫曼编码上的应用
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- Java——继承性(继承的作用、实现、限制)
- JavaWeb——JSON语法讲解与Jackson解析器完成JSON数据与Java对象的转换(应用Ajax与JSON实现校验用户名是否在的功能)
- JavaWeb——JQuery之高级案例实战(打开网页自动弹出广告效果、抽奖效果实现)
- JavaWeb——JQuery之高级操作应用及实践案例总结(动画、遍历、事件绑定)
- Java——简单Java类深入(数据表与简单Java类、一对多映射、双向一对多映射、多对多映射)
- Java——代码块(普通块、构造块、静态块)
- JavaWeb——JQuery之五种选择器的应用及实践案例总结(基本选择器、层级选择器、属性选择器、过滤选择器、表单过滤选择器)
- Java——引用传递实例分析(进阶分析、对象比较、类与类的关联实现)
- JavaWeb——JQuery之基本概述与快速入门实践总结(JQuery各版本区别、JQuery对象和JS对象的区别与转换)
- Java——动态代理设计模型概述(实现步骤、增强方式)与代理商采购电脑模拟程序实战
- Java——this关键字(调用本类属性、调用本类方法、表示当前对象)
- 5分钟玩转Lighthouse|零基础也能拥有WordPress个人博客
- Java——String类常用方法总结,看这一篇就够啦(比较、查找、截取、替换、拆分、其他)
- Java——深入分析类与对象(封装性、构造方法与匿名对象、简单Java类开发原则)
- Java——类与对象(基本概念、定义、内存分析、引用传递)