JavaScript程序基础（三）用console.log()方法在网页中调试JavaScript

已于 2022-03-15 22:56:56 修改
阅读量1.6k 收藏 2
点赞数
分类专栏： javascript 文章标签： javascript 前端 html
于 2022-03-15 22:56:16 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/xcjyxy2021/article/details/123514822
版权
这篇博客介绍了如何利用JavaScript中的console.log()方法进行网页调试，替代传统的alert()方式。详细步骤包括在Chrome浏览器中开启开发者工具，设置断点，并通过F10、F11、F5等快捷键控制代码执行，最后在Console面板查看输出结果。
摘要由CSDN通过智能技术生成

在JavaScript中，经常面临需要测试查看数据结果的情况，如果都是用alert()方法将数据弹出来，会有很多不便。
我们在调试JavaScript时，更常用console.log()方法来进行调试。

  1. 编写一段js代码，console.log()用于在控制台输出信息，网页上不会显示。
<html>   
<head>
<title>JavaScript简介</title>
</head
最低0.47元/天 解锁文章
看山还是山，看水还是水
关注
  • 0
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
JavaScript调试技巧之console.log()详解
10-23
对于JavaScript程序的调试，相比于alert()，使用console.log()是一种更好的方式，原因在于：alert()函数会阻断JavaScript程序的执行，从而造成副作用；而console.log()仅在控制台中打印相关信息，因此不会造成类似的顾虑
简单的console.log()案例
qq_46538844的博客
08-23 480
如果您的浏览器支持调试，你可以使用 console.log() 方法在浏览器中显示 JavaScript 值。浏览器中使用 F12 来启用调试模式， 在调试窗口中点击 "Console" 菜单。
lazy-logger:用于客户端的简单日志记录包装器，以在页面正文中显示console.log，console.warn和console.error消息（减少了需要打开控制台的时间）
05-11
懒人记录器 客户端的简单日志记录包装器，用于在页面正文中显示console.log，console.warn和console.error消息（减少了打开控制台的次数）。 仅包装日志，警告和错误。 相当简单的输出（依赖于toString），因此您可能会经常看到“ [object Object]”。 建立主要是为了让我知道开发过程中会有消息。 该软件包不会被编译到生产环境中。 去做 可能什么也没有，对于我的用途来说效果很好。 公关，如果你想添加任何东西。
Javascript的console.log()用法
塑料机霸
03-03 1639
把下面代码保存为html文件，然后IE8---F12---脚本---控制台里就会出现有趣的东西，如果是Firefox，安装了FireBug后，则F12--控件台--所有 ，同样可以看到。 javascript的console.log()用法 /* console.log 原先是 Firefox 的“专利”，严格说是安装了 Firebugs 之后的 Firefox 所独有的
＜JavaScript基础-console.log控制面板＞
weixin_45540964的博客
11-26 103
javascript基本知识之console.log()
代码人生的博客
05-08 2731
HTML DOM console.log() 方法
JS中将控制台log输出显示到浏览器中
weixin_33724659的博客
06-27 857
JS中将控制台log输出显示到浏览中 一、背景 有时候需要，将返回的请求数据打印在Chrome中的控制台中，方便对比数据，对比实际返回数据是否和API约定数据一致。这时需要在代码中添加console.log 片段，将数据限制在浏览器的控制台中。 二、操作 在代码添加需要返回的数据，并打印出来，在浏览器中查看。 （1）在代码中添加（）： conso...
JavaScript调试之console.log调试的一个小技巧分享
10-19
日常开发中经常会需要console来查看当前对象的值。当然用debugger会更全面的查看，但是...下面这篇文章主要给大家分享了关于JavaScript调试之console.log调试的一个小技巧，需要的朋友可以参考借鉴，下面来一起看看吧。
javascript 在firebug调试时用console.log的方法
01-19
当你使用console.log()函数时，下面的firebug一定要打开，不然这函数在用firefox运行时无效且影响正常程序，如果用IE打开，将会出错。 第一个参数可以是一个包含格式化占位符输出的字符串，例如： console.log(...
JavaScript中console.log()函数的用法
迁就100
07-15 5531
其实这个方法和alert方法类似，唯一不同的是该方法是显示在控制台的，而alert()方法是显示在浏览器上的，比如： <script> var a=23.4; alert(typeof(a)); </script> 这是使用alert()函数的结果，显示在页面上 <script> var a=23.4; console.log(typeof(a)...
c++ log函数_别光知道用console.log调试了，快来试试这些高效的调试方法！
weixin_39958559的博客
11-21 524
作为一名前端开发人员，你一定经常使用 console.log 来进行开发调试，这当然没什么问题，但你可能不知道，除了 console.log ，浏览器的 Console 对象还包含了许多其他非常有用的方法，让我们一起来领略一下吧。console.log介绍console.log方法使我们最常使用的了，用于在控制台打印信息。他的功能还是很强大的，各种数据类型如number、string、array、...
浏览器 console.log 调试，花样彩色输出信息，玩转 console.log
qq_43762932的博客
09-07 1099
浏览器 console.log 调试，花样彩色输出信息，玩转 console.log
html js打印日志,JavaScript的console.log()方法怎么用？
weixin_39566773的博客
06-11 5072
console.log()是JavaScript中的一个内置函数，用于在控制台输出信息；该方法对于开发过程进行测试很有帮助。可以输出之前在其中定义的任何类型的变量，或者只输出需要显示给用户的任何消息。语法console.log(message);参数：它接受一个参数，该参数可以是数组，对象或任何消息。返回值：返回给定参数的值。下面通过示例来看看console.log()方法的使用示例1：传递数字作...
【25JavaScript 调试】JavaScript调试技巧：掌握console.log、断点调试和浏览器开发者工具，轻松解决代码中的错误和异常情况
燃正科技
06-06 979
调试是每个开发者都需要掌握的重要技能。通过使用 console.log()、断点调试、try...catch 和浏览器的开发者工具，我们可以更快地找到和修复代码中的问题。版权所有燃正科技。
Javascript 获取标签内容的方法
demopy’s blog
12-27 4939
JS获取标签内容的方法 测试代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <div id="box"> <p>这有个 第一个p</p> ​ <p>这
Postman进阶篇（二）-console控制台（查看接口日志、调试代码）
热门推荐
做测试多少要会点的技能
08-27 1万+
console控制台详细介绍
console.log()、console.log(this)报错-总结
zt199718的博客
07-21 2075
console.log()和console.log(this) 跳转到的页面中有console.log(this)（16个）或者console.log()（10个）,那么页面就会报错; 但是这个console.log(this)如果不在生命周期函数中,当前页面本身是不报错的，但是跳转到的这个页面如果有会报错（10个）。 单独的console.log()不管在哪里，都会报错（10个） 但是如果这个console.log(this)存在生命周期函数中，那么当前页面也会报错（10个）。 注意：当我们在页面中打
【前端】vue(前端)项目的控制台console在浏览器界面里
洛尧的博客
03-18 4697
打开浏览器 屏幕是浏览器界面时按F12，有的电脑是同时按Fn和F12。 console.log("")或者console.error("") 或者其他 （图中红色就是输出醒目的error） 不管什么编程都离不开输出调试，结果我一直搜不到vue的console在哪，问了未来同行才知道 ，真是。也试了F12，但好像是因为没在浏览器里点，在IDEA里点的，所以没反应。 ...
javascript console.log()方法
最新发布
09-14
console.log()是JavaScript中用于将消息打印到浏览器控制台的方法。它可以用于调试代码和输出信息。 例如，你可以使用console.log()来打印一个简单的消息： ```javascript console.log("Hello, World!"); ``` 这...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值