在谷歌浏览器中如何查看js代码在终端的运行结果、如何查看请求头信息

已于 2022-02-19 15:31:45 修改
阅读量6k 收藏 2
点赞数
分类专栏： JavaScript 文章标签： javascript 开发语言
于 2021-11-10 17:24:54 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_46612221/article/details/121251287
版权

在谷歌浏览器中如何查看js代码在终端的运行结果、如何查看请求头信息

1 如何查看js代码在终端的运行结果（如何打开终端）

方法1：从html页面中进入谷歌浏览器，点击谷歌浏览器右上角三个点
在这里插入图片描述
点击更多工具
在这里插入图片描述
点击开发者工具
在这里插入图片描述

方法2：在浏览器页面空白处右击鼠标，点击检查
在这里插入图片描述

方法3：快捷键：shift+ctrl+j

上面三种方法都会显示以下信息：Elements：看到页面元素的样式等信息
在这里插入图片描述
Console：终端的输出信息，在这个地方可以看到js代码的结果在这里插入图片描述

2 查看请求头信息

打开浏览器的开发者工具，点击NetWork选项卡。
请添加图片描述
但是什么都不操作是看不到请求头信息的，因此我们尝试在百度中搜索一下：北京冬奥会，这时该界面发生了一些变化：
请添加图片描述
点击新出现的这一行，然后选择Headers，就可以看到请求头信息了：
请添加图片描述

橘猫吃不胖～
关注
  • 0
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
Chrome 查看和调试js代码
梦想无论怎样模糊，总潜伏在我们心底，使我们的心境永远得不到安宁.
02-26 1268
ctrl+shift + j
如何查看网页操作中调用的js方法
wchwdog13的博客
06-13 1万+
​比如点击网页中的某个按钮时，如何知道调用了哪个js方法。 首先打开谷歌浏览器，按f12进开发者模式，然后点击source选项卡。 ​找到event listener breakpoints，选择相应的选项后，再从页面中执行相应的动作后，即可显示出调用的js。 ...
【如何使用chrome开发者工具调试javascript代码】
最新发布
qq_69223185的博客
04-24 1745
如何使用Chrome开发者工具调试javascript代码
浏览器查看响应头与请求头方法
weixin_52690231的博客
03-15 3419
浏览器查看响应头与请求头方法
怎么使用chrome的开发者模式找见某个js事件来源于那个js文件
分享开发过程中遇到的技术难点，用博客做记录，也可为程序员提供解决方法。
07-30 3376
怎么找到某个点击事件对应的js文件
介绍一下主流的浏览器的开发者工具(js调试和查看网络请求）
伟庭师兄的博客
09-07 1060
​ （这里咱以axios为例） ■ 在Request Headers 默认看到的仅有请求头，点击一下，就可以看到请求行和(请求方式、请求路径、协议下面)请求头□ 当请求方式是get时，请求体拼接在请求路径url上 □ 当请求方式是post时，请求体在■ 同样，在Response Headers 默认看到的仅有响应头，点击一下，就可以看到响应行和(协议、响应状态码下面)响应头□ 想看响应体，直接点击 （这里咱依然是以axios为例，axios请求成功有一个then方法，调用then方法，打印一下请求
chrome浏览器控制台执行js脚本
muxiaomimi的博客
08-30 5192
本文章引用自https://www.cnblogs.com/WangHaiMing/p/9553678.html Chrome的snippets是小脚本，还可以创作并在Chrome DevTools的来源面板中执行。您可以访问和从任何页面运行它们。当你运行一个片段，它从当前打开的页面的上下文中执行。本文主要讲如何使用，并完成一个页面自动刷新的功能。 第一步 首先f12 打开开发者工具，再打开Sources面板中，单击上Snippets选项卡，在导航器中单击鼠标右键，然后选择New。 ..
谷歌浏览器ModHeader 请求头插件
07-25
7. **实时编辑**：在浏览网页过程中，可随时调整请求头，即时看到结果。 **四、应用场景** 1. **API调试**：开发或测试Web API时，可以通过调整请求头来验证不同参数下的响应。 2. **跨平台模拟**：模拟移动设备...
css让table不显示边框的代码在火狐和谷歌浏览器中无效
12-13
牛腩新闻发布系统中 在table处遇到了麻烦，这个麻烦是我们在css中已经写好了使table不显示边框的代码，在ie浏览器中显示正常，但是在火狐和谷歌浏览器中显示不正常，table的每个边框都显示了出来，因为浏览器不同...
谷歌浏览器js打开IE浏览器.rar
10-26
本示例“谷歌浏览器js打开IE浏览器.rar”提供了一个解决方案，它允许用户在谷歌浏览器（Chrome）中通过JavaScript代码启动IE浏览器。这主要适用于那些需要在现代浏览器环境下触发旧版IE兼容模式的场景。 JavaScript...
BarbushinPHPConsole在谷歌浏览器中处理PHP错误转储变量远程执行PHP代码
08-07
**Barbushin PHP Console** 是一款用于PHP开发的工具，特别设计用于在谷歌浏览器（Google Chrome）中方便地处理PHP错误、转储变量以及执行远程PHP代码。这个工具极大地提升了开发者在调试PHP应用程序时的效率，使得...
google浏览器javascriptvoid,谷歌浏览器运行js脚本
wenangou的博客
10-24 492
大家好，小编来为大家解答以下问题，谷歌浏览器怎么运行js脚本，谷歌浏览器如何运行js脚本，现在让我们一起来看看吧！对 JS 程序的调试，除了在 JS 程序中使用 alert()、console.log() 方法跟踪和调试代码外，开发人员也会经常使用一些调试工具。最常用的 JS 调试工具就是一些主流的浏览器的调试工具，如 IE11 浏览器的“开发人员工具”、Firefox 浏览器的“Firebug”工具或较新版本的“开发者>>Web 控制台”以及 Chrome 浏览器的“开发者工具”。
chrome 浏览器调试技巧
miin_ying的博客
05-13 3509
1.console 1.console.count:统计代码被执行的次数。经常放在函数里，表示这个函数被执行次数. 2.打印对象 2.1 console.dir:以树形结构展示对象的所有属性和方法，因为有时使用console.log打印，只有[object Object] 2.2使用大括号{} console.log({obj1,obj2}) 2.3展示数组 / 对象 使用console.table(obj),以表格的方式展示 3. console.time开始计时 cons.
如何用谷歌（Chorme） 浏览器查看请求头（header）、响应头？
热门推荐
qq_39380155的博客
04-20 1万+
目录第一步：打开谷歌浏览器控制台第二步：点击 Network第三步：重新加载页面第四步：查看请求头信息 第一步：打开谷歌浏览器控制台 右键点击页面，点击检查，控制台界面如下： 第二步：点击 Network 第三步：重新加载页面 （若已有数据就不用加载）点击刷新，重新加载页面。 第四步：查看请求头信息 选择name列表下的数据，点击其中一个，就能看到该条数据的请求头信息。 以这条信息为例 通...
console.log(iVal)是什么？显示在哪里？
qq_27494201的博客
11-11 3242
1.是什么？ 两种含义： 1.终端的输入输出信息的记录日志 2.console.log()是用来调适javascript的 2.在哪里？ 拿谷歌浏览器来说，进入页面，然后按f12进入页面调试模式，里面有一个console选项，你点一下，就可以看到你console.log输出的内容了 ...
狂神说JavaScript学习笔记
蓝夕的博客
06-17 440
1.字符串 1.在浏览器控制台打印变量 var num=1; // 在浏览器控制台打印变量 console.log(num); ​ var PI=3.14;//ES6前规范用大写字母定义的变量作为常量,建议不要修改 const NUM=1;//ES6定义常量用const,定义之后无法修改 2.注意 /*==等于 整数类型的1和字符串类型的"1"相等 ​ ===绝对等于 ​ NaN不==NaN ​ 只能通过isNaN(NaN)来判断 ​ Math.abs(1/3-(1-3/2))<0.0.
Google Chrome 调试JS简单教程
stay hungry ! stay foolish!
03-20 1649
Google Chrome 调试JS简单教程 一、移动端开发调试 现在新版chrome弹出控制台后如下图，其中的工具对移动端调试非常方便。 在控制台中可以直接模拟手机、调整UA、修改网络连接状态 二、Elements标签页 这个就是查看、编辑页面上的元素，包括HTML和CSS： 左侧就是对页面HTML结构的查看与编辑，...
使用 Chrome 开发者工具进行 JavaScript 问题定位与调试
natalie86的专栏
01-11 1364
JavaScript 的调试工具在近年来有了长足发展，几乎每一款主流浏览器都配备了专门的调试工具。Google 的 Chrome 浏览器自带了 JavaScript 调试工具 developer tools（以下统称开发者工具）。这款工具在易用性、稳定性和调试效率方面并不逊于其他常用调试工具（如 FireBug），并且它增加了很多其他工具所不具备的新功能。本文着重从调试 JavaScript
Chrome查找发请求的js之黑箱调试
gsls200808的专栏
05-13 965
查bug时发现有个请求404了 接下来需要去溯源，找出这个请求是哪个js发起的 点击这行请求 发现在jquery.mega.js的1629行，点进去 可以看到对应的js文件，找到1629行 对文件内容 右键 Blackbox script 启用黑箱调试之后这个js会变黄 双击行号可以下断点，断点行会变成蓝色箭头 右键 Add selected text to watches可以将指定的遍历和表达式加入Watch，刷新页面就可以看到值了 可以看到监听的s是一个12
在谷歌浏览器上查看淘包网原型文件
06-13
您可以按以下步骤在谷歌浏览器上查看淘包网原型文件： 1. 打开谷歌浏览器并登录您的淘包网账号。 2. 进入淘包网原型文件所在的页面。 3. 点击浏览器地址栏左侧的锁形图标，然后选择“站点设置”。 4. 在站点设置页面中，将“JavaScript”设置为“允许”。 5. 刷新页面，然后您就可以查看淘包网原型文件了。 请注意，如果您没有淘包网账号或者没有权限查看原型文件，那么以上步骤可能无效。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值