首页/新闻资讯/详情

副队长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运行效果时同步打开开发者工具控制台查看代码运行情况。所以建议大家也养成这样的习惯学会使用开发者工具的控制台查看代码运行信息。
延伸阅读

更多相关文章

副队长JavaScript教程(2)–在网页中使用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的…

副队长JavaScript教程(7)–JS之字面量详解
2026/10/20 1:10:37

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

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

PhpOffice相关注意点，下载图片，导出导入等功能
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 …

YOLOv11结合Slim-Neck：高效目标检测器架构优化与边缘部署实践
2026/10/20 5:06:22

YOLOv11结合Slim-Neck：高效目标检测器架构优化与边缘部署实践

YOLOv11 出来之后，我用它刷了几个检测项目，整体确实顺手，但我一直觉得脖子这块有压缩空间。哪怕模型在精度上越做越强，Neck 依旧是整个网络里参数量和计算量的大头。正好手头有个边缘设备上的落地项目，显存和带宽都抠得…

用LLM+浏览器自动化打造GitHub智能代理：Clawless实战解析
2026/10/20 5:06:22

用LLM+浏览器自动化打造GitHub智能代理：Clawless实战解析

1. 项目背景与需求拆解1.1 为什么我给 GitHub 操作装了一个“智能代理脑”做开发这些年，GitHub 上的日常操作其实非常规整：看 issue、关 issue、拉分支、提交 PR、检查 CI 状态、回复评论。这些操作本身不难，难的是“一天要重复几十次”。尤其…

TensorFlow实战宝可梦图像分类：从数据清洗到模型部署全流程
2026/10/20 5:06:22

TensorFlow实战宝可梦图像分类：从数据清洗到模型部署全流程

1. 项目缘起与整体设计思路宝可梦图像分类这个题目，乍一看像是玩具项目，但真正动手做过的人都知道，它几乎涵盖了图像分类任务中所有典型的坑：类别数量多、类间差异小、类内差异大、数据分布不均衡、背景干扰严重。我当初选这个题目…

YOLOv11轻量化改造：Slim-Neck特征融合原理与实战
2026/10/20 5:06:22

YOLOv11轻量化改造：Slim-Neck特征融合原理与实战

YOLOv11出来之后，我身边的不少开发者都在聊同一个话题：模型越来越大，算力需求越来越高，可现实里的部署场景往往就那么点内存、那么点算力。尤其是在边缘设备、嵌入式平台、实时视频流分析这类环境里，跑大模型根本不现实…

Codex赋能可视化大屏开发：高效工作流构建与实战指南
2026/10/20 5:06:22

Codex赋能可视化大屏开发：高效工作流构建与实战指南

做可视化大屏开发这几年，我越来越确认一件事：真正拖慢进度的从来不是某个图表不会写，而是从业务需求到最终成品的反复拉扯。业务方丢来一句话需求，设计师给一版高保真，前端再照着还原，中间任何一环出现理解…

知识图谱入门：从三元组到大模型检索增强生成实战
2026/10/20 5:01:22

知识图谱入门：从三元组到大模型检索增强生成实战

1. 知识图谱到底在解决什么问题1.1 从“搜不到”到“问得准”的认知转变很多人第一次接触知识图谱，是被“图谱”两个字吓住的，觉得这玩意儿肯定跟图论、算法、复杂网络这些硬核概念绑在一起。其实你换个角度想就通了：传统搜索引擎给你一堆网页…

金融AI落地指南：从调研报告到技术选型与工程实践
2026/10/19 18:06:35

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

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

单片机C运行时从启动到多任务：中断安全与共享资源冲突
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 …

GCC编译四步详解：预处理、编译、汇编、链接实战
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 …

FIW线是什么？FEP注塑线与普通氟塑料线的区别及应用指南
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
免费获取方案
☎咨询二维码 ☎ ↑