浏览器 f12 的 console 功能简介

在做前端开发时, chrome 浏览器的 f12 功能非常好用, 可以调试 html js css 代码
其中 console 标签页表示控制台, 我们可以输入 js 代码, 回车执行

常用的命令有

• console.log 打印日志
• console.count 计数器, 记录执行的次数
• console.time 计时, console.timeEnd 停止计时并打印
• $() 表示使用选择器获取单个元素, $$() 表示使用选择器获取元素数组

 // 打印 log info debug warn error
  let username = '你好鸭'
  // 加上大括号, 变为对象, 这样可以节省 手动打印变量名
  console.log({username})
  
 // 计数器 count
  // 计数, 并打印 label: 1
  console.count('label');
  // 计数, 并打印 label: 2
  console.count('label');
  
 // 计时器 time timeEnd
  console.time('go');
  for (let i = 0; i < 200000; i++) {
    let x = Math.random() * 2000;
  }
  console.timeEnd('go'); // go: 11.7861328125 ms

// 获取单个元素
$('p')
// 获取元素数组
$$('p')