Chorme控制台console的用法;

前提:是谷歌浏览器!

IE8- 不支持console.log();会报错,解决如下:

(function (){//创建空console对象,避免JS报错  if(!window.console)  window.console = {};  var console = window.console;  //添加console对象的方法var funcs = ['assert', 'clear', 'count', 'debug', 'dir', 'dirxml',  'error', 'exception', 'group', 'groupCollapsed', 'groupEnd',  'info', 'log', 'markTimeline', 'profile', 'profileEnd',  'table', 'time', 'timeEnd', 'timeStamp', 'trace', 'warn'];  for(var i=0,l=funcs.length;i<l;i++) {  var func = funcs[i];  if(!console[func])  console[func] = function(){return;};  }  if(!console.memory)  console.memory = {};})();

 

 

CONSOLE使用注意事项(或快捷键):

1、控制台输入多行代码??  解决方式是使用  " ; "  分隔 或使用 " shift +enter "实现代码换行

2、键盘的上下键 可以使用用户在控制台输入的历史代码

3、$_  可以获取上一次表达式执行的结果,注意使用时候要和运算符号要保持一个空格, $0表示最近点击的dom节点,$4表示前面第五次点击的dom节点,只能存储五次历史记录,超出为undefined

4、console控制台支持原生的jquery选择器,使用如$('body')

5、copy(name) 可以将控制台获取到的内容复制到粘贴板;

6、keys(obj) 和 values(obj) 分别可以获取对象的对象名组成的数组和对象值组成的数组

7、 monitor(funName)监听执行函数的函数名和函数参数,unmonitor(funName)停止监听;

8、输出指定样式的文字,如console.log("%c大家好","color:red;")

9、clear() 可以清空控制台输出记录,相当于console.clear(),也可以使用快捷键  "ctrl + L",或者右键清空

 

 

CONSOLE怎么用??

1、查询数组或对象大量数据时候,避免使用alert()弹框造成崩溃

 

2、调试使用时,使用console.log();  console.info();  console.error(); console.warn();   不同文本打印颜色区分不同的提示信息

 

3、使用console.clear() 或者console界面左上角图标清空console记录;

    console.log(‘string1’,’string2’) 打印的时候会将多个字符串拼接输出日志;

 

4、使用console,group(titleName);  console.groupEnd(); 输出具有开头的分组信息

 

5、console.assert(isFalse,'falseMsg'); 会对指定指定的表达式进行判定,只用表达式为false时候才会输出相应的信息到控制台

 

6、console.count(); 可以统计代码被执行的次数

 

7、console.dir()可以以DOM树结构输出一个对象的所有属性和方法,也可以简写成dir(obj);console.table()可以将数组用表格的形式输出,也可以简写成table(arr);

 

8、console.time()  和console.timeEnd() 一起可以用来统计时间间隔

 

9、console.profile() 和console.profileEnd()一起可以查看CPU的相关使用情况

 

10、console.trace()  堆栈跟踪相关的调试

11、console.timeLine() 和console.timeLineEnd() 一起可以记录一段时间轴

 

 

 

参考网址:https://www.cnblogs.com/Leo_wl/p/4117446.html

https://developer.chrome.com/devtools/docs/console-api

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/554064.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

null、undefined、NaN区分解析和条件判定,以及在IF条件中的判定

NaN的理解和用法&#xff1a; NaN 属性是代表非数字值的特殊值。该属性用于指示某个值不是数字。可以把 Number 对象设置为该值&#xff0c;来指示其不是数字值。 Number.NaN 是一个特殊值&#xff0c;说明某些算术运算&#xff08;如求负数的平方根&#xff09;的结果不是数…

vue项目中全局引用jquery 、引用外部js的多种方式(外部纯函数js、外部自执行js、外部js插件),附niceScroll滚动条插件使用

vue项目中全局引用jquery &#xff1a; 1、“ npm install jquery --save ” 命令安装jquery 2、在项目根目录下的 build 目录下找到webpack.base.conf.js 文件&#xff0c;在开头使用以下代码引入webpack&#xff0c;如下 var webpack require(webpack) 3、在webpac…

vue生命周期详解、钩子函数的调用(简单易懂)

定义&#xff1a;vue的生命周期是指vue实例从初始化创建到实例销毁的过程。期间会有8个钩子函数的调用。 vue的钩子函数图解&#xff1a; vue的钩子函数使用总结&#xff1a; 1、beforeCreate&#xff08;创建前&#xff09;:beforeCreate钩子函数&#xff0c;这个时候&#x…

vue-router详尽:编程式导航、路由重定向、动态路由匹配、路由别名、嵌套路由、命名视图

vue-router编程式导航 在vue项目中经常用到this.$router.push() 和 this.$router.replace() 方法进行路由跳转就是编程式导航。。。 通俗理解编程式导航&#xff1a;通过操作$router实例的JavaScript代码实现路由跳转。点击 <router-link :to"..."> 等同于调用…

java基础学习笔记(一)

java开发环境搭建&#xff1a;JDK配置 java 集成开发环境IDE&#xff08;Integrated Development Environment&#xff09; 》Eclipse工具 1、官网下载后安装elipse&#xff0c;注意&#xff1a;Eclipse 安装时JDK位数和Eclpise位数必须保持一致&#xff0c;安装过程中Switch…

常用矢量图有哪些格式?AI文件存储为psd分层

前言 下载的矢量图资源会发现有ai格式、cdr格式的、eps格式、icon格式&#xff0c;有的能使用Photoshop打开而有的不行。使用Photoshop保存矢量图时候选择什么格式保存都是经常遇到的问题。 常见问题及解决&#xff1a;PS打开ai格式的矢量图文件&#xff0c;你用PS打开发现只…

java基础学习笔记(二)

1、数组排序之选择法排序和冒泡排序&#xff1f; 选择法排序原理&#xff1a;数组第一位和后续位置数值比较&#xff0c;最大或最小的调换位置后放在第一位&#xff1b;依次比较将第二大或小的值调换位置后放在第二位置&#xff1b;代码如下&#xff1a; for (int j 0; j <…

java基础学习笔记(三)

1、装箱和拆箱 所有基本类型都有对应的类类型&#xff0c;比如int对应的类是Integer,这种类就叫做封装类。数字封装类有Byte、Short、Integer、Long、Float、Double这些类都是抽象类Number的子类。封装类和基本类型之间可以相互转换&#xff0c;而基本类型自动转封装类型就叫装…

名片设计尺寸及注意事项(详尽),附加:文字转曲线或外框字;网址、文字转二维码方法

附加&#xff1a; 文字如何转曲线或外框字&#xff1f;&#xff1f; "转曲"是在用Corl Draw(简称CD)或者Adobe Illustrator(简称AI)做图时对文字作的一项重要操作,因为如果不转曲的话在把文件拿到其它电脑上编辑时可能会因为缺少字体文件而不能正常显示文字!! 转曲…

AVI转MP4视频无损格式转码

前言&#xff1a;产品宣传需要无损avi转mp4转换格式 前期准备&#xff1a; 格式工厂 下载链接&#xff1a;https://pan.baidu.com/s/1WLD1ip9EaMdca_k2x7Zhvg 提取码&#xff1a;i4nx DIVX、AVC、HEVC三种压码格式的区别&#xff1a; DivX是早期的MPEG4视频压缩编码&…

vue-cli搭建和“Cannot find module npm-cli.js” 、“operation not permitted” 、 deprecated coffee-script等错误

前言&#xff1a;重装nodejs后&#xff0c; vue-cli搭建项目后运行vue项目报错报错 "npm Error: Cannot find module npm-cli.js" &#xff0c;同时发现npm -v 也报错。 分析: vue-cli脚手架模板是基于node下的npm来完成安装的&#xff0c;安装vue-cli也会先安装no…

websocket 学习--简单使用,nodejs搭建websocket服务器,到模拟股票,到实现聊天室

websocket简介&#xff1a; WebSocket协议是 HTML5 开始提供的一种基于TCP的一种新的全双工通讯的网络通讯协议。它允许服务器主动发送信息给客户端。 和http协议的不同&#xff1f;&#xff1f; HTTP 协议是一种无状态的、无连接的、单向的应用层协议。它采用了请求/响应模型…

红队打靶练习:DIGITALWORLD.LOCAL: FALL

目录 信息收集 1、arp 2、netdiscover 3、nmap 4、nikto 5、whatweb 6、小结 目录探测 1、gobuster 2、dirsearch WEB 80端口 /test.php 文件包含漏洞 SSH登录 提权 get root and flag 信息收集 1、arp ┌──(root㉿ru)-[~/kali] └─# arp-scan -l Interfa…

vue全局安装jquery,vue使用bootstrap框架,vue中封装websocket通讯,vue引入element-ui 组件库,引入highcharts图表插件

vue安装jquery&#xff1a; 1、使用vue-cli创建好vue项目后&#xff0c;在项目文件夹下&#xff0c;使用命令npm install jquery --save-dev 引入jquery。 2、修改项目文件 build/webpack.base.conf.js&#xff0c;添加如下内容&#xff1a; var webpackrequire(webpack) mo…

flex弹性布局笔记

学习自菜鸟教程的flex布局笔记 布局的传统解决方案&#xff0c;基于盒装模型&#xff0c;依赖 display 属性 position 属性 float 属性。它对于那些特殊布局非常不方便&#xff0c;比如&#xff0c;垂直居中就不容易实现。 简介&#xff1a; W3C提出了一种新的方案—-Flex布…

css宽高自适应布局,实现Sticky Footer的三种布局方式

宽度自适应布局&#xff1a; 1、使用场景&#xff1a; 一侧&#xff08;左侧或者右侧&#xff09;为固定的导航或者菜单栏&#xff0c;另一侧将会随着浏览器的缩放而自适应改变其大小。这种布局结构可用于顶层布局结构亦可用于某个局部功能块&#xff0c;常见于各种web系统&am…

vue学习:事件传递(冒泡和捕获),事件委托,jquery中的事件委托,$event 获取元素,vue事件修饰符

事件传递 ----冒泡和捕获 DOM事件标准定义了两种事件流&#xff0c;这两种事件流分别是捕获和冒泡。 和许多Web技 术一样&#xff0c;在它们成为标准之前&#xff0c;Netscape和微软各自不同地实现了它们。Netscape选择实现了捕获事件流&#xff0c;微软则实现了冒泡事件流。…

vue中路径的配置使用

绝对路径使用&#xff1a; 在项目中build文件夹下的webpack.base.conf.js的 使用如下&#xff1a; import mock from /mock/mock.js; html 相对路径使用 1. 当需要引用 同一目录下的文件&#xff0c;直接输入文档, 如下 <img src”bg.jpg” /> 2、当需要引用下一级目录…

常用MIME类型,解决IIS布署后字体文件、mp4视频文件等not found 的错误

前言&#xff1a;项目在本地运行正常&#xff0c;但部署在IIS服务器后使用浏览器访问项目会报&#xff1a;404 not found 错误&#xff0c;包括mp4视频文件和woff文件找不到。。如下 原因&#xff1a;在IIS中没有将 .mp4和 .woff 后缀的相应的MIME类型&#xff0c;使得 .mp4等格…

浏览器兼容video视频播放的多种方法

前言&#xff1a; 在 HTML 中播放视频并不容易&#xff01;因为直到现在&#xff0c;仍然不存在一项旨在网页上显示视频的标准。今天&#xff0c;大多数视频是通过插件&#xff08;比如 Flash&#xff09;来显示的。然而&#xff0c;并非所有浏览器都拥有同样的插件。 比如win…