zoukankan      html  css  js  c++  java
  • chrome console cheat sheet

    快捷键

    打开console界面快捷键:ctrl+shift+J

    清空log:ctrl+L

    选项

    Log XMLHTTPRequests:显示ajax

    Preserve log upon navigation:页面跳转时保留log

    javascript方法

    console.log:普通

    console.info:=console.log

    console.warn:警告

    console.error:错误

    console.count:输出被运行的次数,以参数分组计数

    console.dir:把内容当作DOM或者javascript对象格式输出

    console.dirxml:把内容输出为xml格式

    console.assert:第一个参数为false时输出

    console.trace:输出javascript调用栈

    console.group:分组,可指定分组名

    console.groupCollapsed:初始是折叠的分组开始标记

    console.groupEnd:结束最近的分组,不接收参数

    console.time:计时开始,传入参数为计时器名称

    console.timeEnd:计时结束,必须与计时开始的计时器名称相同

    console.timeStamp:在timeline视图中添加一个监控点

    console.clear:清除控制台已经输出的log

    debugger:在javascript设置断点

    debugger;

    占位符和输出格式

    %s 字符串
    %d, %i 数字
    %f 浮点数
    %o DOM元素(DOM的源代码)
    %O javascript对象
    %c

    指定输出内容的样式,样式作为第二个参数传入

    console.log("%cThis will be formatted with large, blue text", "color: blue; font-size: x-large");

    控制台命令

    clear:清除log

    $():= document.querySelector()

    $$():=document.querySelectorAll()

    $x():XPath表达式

    $_ :为最后一次通过$(),$$()或者$x()查询出来的结果

    $0, $1, $2, $3 and $4:最后五次的查询结果

    monitorEvents:监听事件,

    monitorEvents(window, "resize");
    monitorEvents(document.body, ["mousedown", "mouseup"]);
    monitorEvents($('#scrollBar'), "touch"); //指定一个事件集的名字,同时监听 "touchstart", "touchend", "touchmove", 和 "touchcancel"
    mouse "mousedown", "mouseup", "click", "dblclick", "mousemove", "mouseover", "mouseout", "mousewheel"
    key "keydown", "keyup", "keypress", "textInput"
    touch "touchstart", "touchmove", "touchend", "touchcancel"
    control "resize", "scroll", "zoom", "focus", "blur", "select", "change", "submit", "reset"

    unmonitorEvents:取消监听事件

    getEventListeners:返回指定对象上挂载的监听器

    profile:开始收集javascript CPU profile,可以指定名称,同名多次的profile,会被分在同一组下

    profileEnd:结束收集javascript CPU profile

    copy:拷贝对象内容到剪贴板

    dir:= console.dir

    dirxml:= console.dirxml

    inspect:输出DOM元素或者javascript对象

    keys:输出对象的key的数组

    values:输出对象的value的数组

  • 相关阅读:
    在进行页面的DIV CSS排版时,遇到IE6(当然有时Firefox下也会偶遇)浏览器中的图片元素img下出现多余空白的问题绝对是常见的对于该问题的解决方法也是“见机行事”。
    关于图片加载问题
    隐藏iframe边框
    设计模式-状态模式(State)
    软件设计原则
    设计模式-原型模式(Prototype)【重点:浅复制与深复制】
    设计模式-观察者模式(Observer)
    【Parallel】.Net 并行执行程序的使用心得
    个人对【依赖倒置(DIP)】、【控制反转(IOC)】、【依赖注入(DI)】浅显理解
    设计模式-建造者模式(Builder)
  • 原文地址:https://www.cnblogs.com/tjyuanpeng/p/3450091.html
Copyright © 2011-2022 走看看