副队长JavaScript教程(4)–浏览器开发者工具

发布时间:2026/10/20 1:10:37

副队长JavaScript教程(4)–浏览器开发者工具 点此查看所有教程、项目、源码导航本文目录1. 前言2. 打开开发者工具3. 小结1. 前言在上一篇中我们曾经演示过一个错误实例!DOCTYPEhtmlhtmlheadmetacharsetutf-8/headbodyscriptalert(1)alert(2)/script/body/html两句代码由于没使用分号分割导致浏览器无法识别所以程序无法正常运行。这段代码比较简单我们比较容易分析它的问题。但是代码如果复杂起来有成千上万行代码当其中一句有问题时我们该如何知道是哪里出了问题出了什么问题呢此时就要借助浏览器自带的开发者工具了既然浏览器要执行JS代码所以浏览器肯定知道哪些语句不能正常执行。所以浏览器提供了开发者工具以便告知开发者的问题。当然开发者工具的功能远不止如此我们暂时先学习下开发者工具的控制台功能开发者工具的控制台可以查看错误提示信息。2. 打开开发者工具在Chrome浏览器或IE浏览器中都可以直接按【F12】打开开发者工具如下图是Chrome浏览器的开发者工具控制台然后下图是IE浏览器的控制台可以看到两个控制台都给出了错误提示信息然后也告诉开发者代码的问题是第10行。我们VSCode每行代码左边有行号我们看下如下是我的VSCode编写代码的截图第10行正好是有问题的代码位置。3. 小结平常我也是经常编写JS代码习惯性上就是在查看网页JS运行效果时同步打开开发者工具控制台查看代码运行情况。所以建议大家也养成这样的习惯学会使用开发者工具的控制台查看代码运行信息。
延伸阅读

更多相关文章

2026/10/20 1:10:37

副队长JavaScript教程(2)–在网页中使用JS

点此查看 所有教程、项目、源码导航 本文目录1. 前言2. 如何引入JS代码3. 如何确定script标签的位置3.1 代码执行顺序3.2 script位置探讨3.3 script最佳位置4. 浏览器不支持JS的情况处理4.1 现状4.2 使用noscript标签5. 小结1. 前言 上一篇,给大家聊了很多关于JS的…

2026/10/20 1:10:37

副队长JavaScript教程(7)–JS之字面量详解

点此查看 所有教程、项目、源码导航 文章目录1. 前言2. 何为字面量3. 什么不是字面量4. 字符串字面量5. 字面量的类型6. 小结1. 前言 本篇来介绍一个非常非常重要的概念——字面量。不光在JS编程语言中会有字面量的概念,在C/C/C#/Java/Python等语言中,同…

2026/10/20 1:10:37

PhpOffice相关注意点,下载图片,导出导入等功能

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views …

2026/10/20 6:11:27

从28.2%到2.25%:ImageNet七年冠军史,看懂深度学习图像分类进化

先说明一件事:标题里这个“7年”其实是个比较宽泛的说法。ILSVRC从2010年第一届办到2017年谢幕,严格算是八个赛季;但如果从2011年大家开始认真对待这个比赛、正式把它看成一条技术赛道算起,到2017年最后一届刚好七年。无论按哪个口…

2026/10/20 6:11:27

冷链仓储成本失控?WMS用效期与温层管理破局

1. 零售业冷链高成本困局从何而来我做仓储物流这一行十几年,见过不少项目从春风得意到黯然收场。盒马会员店最近传出全线关闭的消息,很多同行在群里讨论,有人说是选址问题,有人说是商品力不够。但我在看这条新闻时,第一…

2026/10/20 6:11:27

谷歌购物/google购物 协议采集分析

声明 本文章中所有内容仅供学习交流使用,不用于其他任何目的,抓包内容、敏感网址、数据接口等均已做脱敏处理,严禁用于商业用途和非法用途,否则由此产生的一切后果均与作者无关! 有相关问题请第一时间点击头像看简介或…

2026/10/20 6:11:27

C语言笔试题

第119~121集&#xff08;鹏哥C语言&#xff09; 文章目录笔试题 1&#xff1a;笔试题 2&#xff1a;笔试题 3&#xff1a;笔试题 4&#xff1a;笔试题 5&#xff1a;笔试题 6&#xff1a;笔试题 7&#xff1a;笔试题 8&#xff1a;笔试题 1&#xff1a; #include <stdio.h&g…

2026/10/20 6:06:26

ppt-master:用代码和配置自动化生成PPT的工程化方案

1. 项目概述&#xff1a;这不是一个PPT模板&#xff0c;而是一套可编程的幻灯片生成系统“ppt-master”这个名称乍一听像是某个网红PPT模板合集&#xff0c;但实际接触过的人很快会发现——它根本不是传统意义上的美化资源包。我第一次在某技术社区看到这个词时&#xff0c;也以…

2026/10/19 18:06:35

金融AI落地指南:从调研报告到技术选型与工程实践

简介&#xff1a;这份PDF报告聚焦2025年金融服务业中国AI现状与趋势&#xff0c;面向金融科技从业者、AI战略规划人员及关注行业数字化转型的研究者&#xff0c;帮助读者把握生成式AI在银行、支付、交易等场景中的落地路径与投资方向。资源包内含1个PDF文件&#xff0c;大小约1…

2026/10/20 1:05:37

单片机C运行时从启动到多任务:中断安全与共享资源冲突

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views …

2026/10/20 1:05:37

GCC编译四步详解:预处理、编译、汇编、链接实战

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views …

2026/10/20 1:05:37

FIW线是什么?FEP注塑线与普通氟塑料线的区别及应用指南

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views …

还想了解更多?直接咨询顾问

免费诊断 + 免费方案 + 透明报价。

全国咨询热线400-8866-253
免费获取方案
☎咨询二维码 ☎ ↑