zoukankan      html  css  js  c++  java
  • 前端开发chrome console的使用 :评估表达式 – Break易站

    本文内容来自:chrome console的使用 :评估表达式 – Break易站

    从 DevTools 控制台使用它的某个评估功能查看页面上任意项目的状态。

    DevTools 控制台让您可通过特定方式了解您页面中的项目状态。通过使用支持 JavaScript 的多个功能,再结合运用您的 JavaScript 知识,评估您可以输入的任何表达式。

    这篇文章主要是将来以下内容:

    • 只需键入表达式即可对其进行评估。
    • 使用一个快捷键选择元素。
    • 使用inspect() 检查 DOM 元素和 JavaScript 堆对象。
    • 使用 $0 – 4 访问最近选择的元素和对象。

    查看表达式


    按下 Enter 键后,此控制台可评估您提供的任何 JavaScript 表达式。输入表达式后,系统将显示属性名称建议;控制台还会提供自动填充和 Tab 自动补全功能。

    如果有多个匹配项,↑ 和 ↓ 在它们之间循环切换。 按 → 键可选择当前建议。如果有一个建议,按 Tab 键选中它。

    控制台中的简单表达式。

    选择元素


    使用下列快捷键选择元素:

    目标选择的示例:

    1
    2
    3
    $('code') // Returns the first code element in the document.
    $$('figure') // Returns an array of all figure elements in the document.
    $x('html/body/p') // Returns an array of all paragraphs in the document body.

    检查 DOM 元素和 JavaScript 堆对象


    inspect() 函数选取一个 DOM 元素或 JavaScript 引用作为一个参数。如果您提供一个 DOM 元素,则 DevTools 进入“Elements”面板并显示该元素。如果您提供一个 JavaScript 引用,则它进入“Profile”面板。

    当此代码在该页面上的控制台中执行时,它会抓取此图并在“Elements”面板上显示它。这会利用到 $_ 属性以获取最后一个评估的表达式的输出。

    1
    2
    $('[data-target="inspecting-dom-elements-example"]')
    inspect($_)

    访问最近选择的元素和对象


    控制台在变量中存储最后使用的五个元素和对象,以方便访问。使用 $0 – 4 从控制台访问这些元素。请记住,计算机从 0 开始计算,这意味着最新的项目是 $0,最早的项目是 $4。

    本文内容来自:chrome console的使用 :评估表达式 – Break易站


    —Author: Arvin Chen —Web Address: www.breakyizhan.com (Break易站)

  • 相关阅读:
    JAVA C 数据类型对应
    JAVA javah
    JAVA java
    JAVA javac
    JAVA jar命令(一)-jar打包class文件
    Unity 中调用Android的JAVA代码
    unity 打包Apk生成签名证书keystore
    SQL Server 备份还原
    C/C++ warning C4251: class ... 需要有 dll 接口由 class“..” 的客户端使用
    如何修复 WordPress 中的 HTTP 错误
  • 原文地址:https://www.cnblogs.com/breakyizhan/p/8179099.html
Copyright © 2011-2022 走看看