JS浏览器调试:Browser对象

2023-11-06

好久不搞前端,最近在搞钉钉的第三方应用的时候,前端给我露了一手,涉及到知识主要是JavaScript的Browser对象。

首先现在很多PC客户端现在技术选型选择会选择nodejs这类,像nw.js或者Electron,都会涉及到chromium的功能,也就是chrome或者其他浏览器的核心。所以说我们在页面可以打开开发者模式,上面的一些对象也是可以通过控制台可以查看。

说到这里,也就是我们说可以当作浏览器调试一样去在这些客户端调试查看(当然,首先要选对对应的客户端,很多产品会把浏览器调试关掉,想要调试要不然再开发者工具,要不然是那种专门个开发的特殊版本,比如钉钉,想要打开开发者模式就要选择钉钉RC版,而且还要在后台设置用户,类似微信小程序管理员权限设置的那种)。

所以JavaScript的Browser也就是浏览器对象,可以提供给我们很多信息。

菜鸟教程的对应地址

Window 对象,Window 对象表示浏览器中打开的窗口。

  • (1)所有浏览器都支持window对象。它代表浏览器的窗口。

  • (2)所有全局 JavaScript 对象,函数和变量自动成为 window 对象的成员。

  • (3)全局变量是 window 对象的属性。

  • (4)全局函数是 window 对象的方法。

如果文档包含框架( 或 标签),浏览器会为 HTML 文档创建一个 window 对象,并为每个框架创建一个额外的 window 对象。

有意思的是,还有History 对象和Location 对象这些也都是windos对象里面的对象。比如

这两个是等价的
windows.location.href
location.href

//下面两个也是等价的,但是奇怪的是菜鸟为什么不把document对象单独拿出来,毕竟document对象平时用的更多些
window.document.getElementById("header");
document.getElementById("header");


还有的浏览器对象有Navigator和Screen两个,但是怎么说呢,虽然很多浏览器都支持,但不是公开的标准之一。

//以下都能获取到“宽度”,但是还是有不同,具体什么我怕也说不清楚现在
document.documentElement.clientWidth
document.body.clientWidth
screen.width

PS:
前端教给我的就是,跳转过来的连接怎么看,通过fillder转包有的只能看到网络地址看不到参数,这时候在对应开发者的consloe下面输出location.href回车就可以了。

location.href

那个知乎的页面测试做截图收尾
在这里插入图片描述

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

JS浏览器调试:Browser对象 的相关文章

随机推荐

  • Logistic回归——银行违约情况分析

    文章目录 一 Logistic回归原理 1 Sigmoid函数作用 2 用梯度下降法求解参数 二 利用Logistic回归分类 1 数据预处理 2 利用梯度上升计算回归系数 3 训练和验证 总结 一 Logistic回归原理 1 Sigmo
  • Linux命令行解密

    本章节将要讲解的命令 命令 命令 用途 type 显示命令类型 which 显示可执行文件的位置 help 获取Shell内建命令的帮助信息 man 显示命令的手册页 info 显示命令的info条目 alias 创建自己的命令 什么是命令
  • 【maven】No plugin found for prefix ‘install‘ in the current project

    1 场景1 1 1 概述 在安装jar文件到本地仓库时有时会遇到这样的问题 解决方法 下载 wagon http lightweight 2 2 jar 位置 https repo maven apache org maven2 org a
  • Unity设计模式之工厂模式

    一 什么是工厂模式 工厂模式是一种创建型设计模式 它提供了一种封装对象创建的方式 将对象的创建过程与使用过程分离 使得代码更加灵活 可扩展和可维护 在Unity中 工厂模式常用于创建和管理游戏对象 对啦 这里有个游戏开发交流小组里面聚集了一
  • MySQL存储结构

    MySQL体系结构 1 网络接入层 提供了应用程序接入MySQL服务的接口 客户端与服务端建立连接 客户端发送SQL到服务端 2 服务层 管理工具和服务 系统管理和控制工具 例如备份恢复 Mysql复制 集群等 连接池 主要负责连接管理 授
  • 客户合并修改需求 @熊哥

    1 客户信息确认列表 如果是 车主信息确认列表 和 车主信息查询列表 调用的标准客户修改功能 保存客户档案时 不校验客户信息重复规则 2 客户信息确认列表 客户信息确认列表 修改为 车主信息确认列表 客户信息合并 修改为 车主信息合并列表
  • Moviepy时间变换time_mirror再遇‘OSError: MoviePy error: failed to read the first frame of video file‘解决示例代码

    老猿Python博文目录 https blog csdn net LaoYuanPython 一 引言 在 https blog csdn net LaoYuanPython article details 106478711 moviep
  • leetcode63. 不同路径 II

    https leetcode cn com problems unique paths ii 一个机器人位于一个 m x n 网格的左上角 起始点在下图中标记为 Start 机器人每次只能向下或者向右移动一步 机器人试图达到网格的右下角 在
  • 程序运行结构

    C 支持最基本的三种程序运行结构 顺序结构 选择结构 循环结构 顺序结构 程序按顺序执行 不发生跳转 选择结构 依据条件是否满足 有选择的执行相应功能 循环结构 依据条件是否满足 循环多次执行某段代码 选择结构 if语句 作用 执行满足条件
  • Python使用opencv实现图片定位第三种方式

    encoding utf 8 author Jeff xie 这个方法识别度更高 比cv2 matchTemplate更好 cv2 matchTemplate无定位的图片 这个方法可以 import cv2 bgPath D Reg Car
  • 如何清理台式计算机内存,如何清理电脑运行内存_电脑运行内存不足怎么解决-win7之家...

    我们在电脑上会运行很多我们需要使用的程序 这样的话会带着电脑运行内存不足变卡的问题 这就需要清理先电脑没在用的程序了或者清理些内存也可以缓解的 那么如何清理电脑运行内存呢 下面小编给大家分享电脑运行内存不足的解决方法 解决方法 一 关闭性能
  • 如何在Vue模板中绑定事件?

    让我们来谈谈你在Vue模板中绑定事件的问题吧 首先 我们要先了解什么是事件 在Vue中 事件是指在模板中绑定的一些特殊的HTML属性 比如v on click 它们可以让我们在用户与页面交互时执行一些操作 在Vue模板中绑定事件有两种方式
  • Cocos Creator3D:制作可任意拉伸的 UI 图像

    推荐 将 NSDT场景编辑器 加入你的3D工具链 3D工具集 NSDT简石数字孪生 制作可任意拉伸的 UI 图像 UI 系统核心的设计原则是能够自动适应各种不同的设备屏幕尺寸 因此我们在制作 UI 时需要正确设置每个控件元素的尺寸 size
  • 4.three.js详解PBR物理渲染

    1 标准网格材质 import as THREE from three 导入轨道控制器 import OrbitControls from three examples jsm controls OrbitControls 导入动画库 im
  • java之路 —— 带你了解安全框架Shiro

    文章目录 前言 一 组件 二 主要开发步骤 三 常用的API 四 认证的流程 前言 在学习之前 让我们先了解一下什么是shiro Shiro Apache Shiro 是一个Java安全框架 提供了身份认证 授权 加密和会话管理等功能 它的
  • nginx重启报找不到nginx.pid的解决方法

    nginx被停止 nginx s stop 或者直接杀掉了进程 kill 9 nginx的进程号 后 调用命令 nginx s reload 或者 nginx s reopen 会报错 无法找到 var run nginx pid 文件 这
  • 以树状结构显示文件夹

    以树状结构显示文件夹 题目要求 编写程序 在命令行中以树状结构显示特定的文件夹及其子文件夹 如果子文件是文件则需要显示文件大小 最后统计整个目录的大小 public class Test static long fileNum 0 stat
  • 华为OD机试 C++ 报数问题

    题目 你和你的朋友们围成一个圈玩游戏 从第一个人开始 依次报数 1 2 3 当数到3的时候 那个人就得退出游戏 然后从他的下一个朋友继续开始 1 2 3 同样的 数到3的人又得退出 这样一直进行下去 直到圈里只剩下一个人 人会是谁 任务 给
  • Android Studio更新升级方法

    android studio一直在更新完善 为了与时俱进 我们当然要将工具更新到最新版本啦 其实更新本来是很简单 只要从Android Studio Help菜单中选择Check for Update即可 但因为 伟大的墙 实际更新失败 下
  • JS浏览器调试:Browser对象

    好久不搞前端 最近在搞钉钉的第三方应用的时候 前端给我露了一手 涉及到知识主要是JavaScript的Browser对象 首先现在很多PC客户端现在技术选型选择会选择nodejs这类 像nw js或者Electron 都会涉及到chromi