第一系列JS调试控制台

写在开始:事实上,我已经决定要写这件事,因为这件事不难,但为什么有那么多人问,他们不会问如何使用控制台,但是不知道为什么他们可以安慰,也知道有这样的事情console.log,但他们不知道为什么要使用字符串而不是警报输出信息。在他们眼里,警报是不够的。好吧,我承认,小Tucao,但这个系列我只打算介绍调试的基本知识,不涉及太多,因为JS知识深层次的东西,如果你的js不一个国家,即使我教你调试bug,打破一些插件,你不知道我在做什么,我的目标就是让你知道你的控制台,让你开始去虫子,还有你自己走路的方式。

当然,骑士,请跳,或槽。

JS调试系列目录:



事实上,所有开发Web的人都知道这一点,不管它是前端还是后台,但是很多人只停留在HTML视图和CSS修改中,所以他们根本不使用控制台。

也许有些初学者还不知道。

关于这种材料的信息在互联网上是非常多的,但是他们都不谈论调试,而是如何使用它。

无论是Chrome浏览器IE(8以上)或360快速浏览器、搜狗浏览器等,只要按下F12打开控制台。

我们的文章以铬为例解释,不是为什么,因为我喜欢铬白菜萝卜爱…

PS:FF是萤火虫的世界之前,现在这是一个很好的人。

现在让我们按F12在控制台中打开控制台,单击。



我可以看到我头部的图像和几行文字,但是下面有几行。我们暂时不理会,以后再解释。

事实上,这个F12,最准确的名称是开发者工具和控制台控制台。

ps:作为一门基础课程,我只介绍了控制台和源码调试等功能,以了解它。

单击右键控制台菜单或输入清除(),然后按回车键清空控制台内容。

让我们把第一步console.log输出信息。

进入console.log(呵呵)和console.log(呵呵




事实上,它是信息,输出很简单,用他代替警报和document.write调试,你的工作会很容易。

例如,调试这部分代码的循环,但数组中有几十个甚至几百个元素,提示你会有点疯狂,

段不是不好,但对对象输出,你只能看到一些像{物}。

这是许多新朋友遇到的真正问题。

如果console.log代替警报document.write输出对象信息,对象可以扩大到在控制台中查看具体信息。

例如:


var arr = { {姓名:年龄:22 },操
对于(var i = 0;i < arr.length;i++){
console.log(ARR {我});
}




您可以直接看到对象信息,并且不显示{对象} }使我们感到困惑。



你突然觉得console.log一团糟

事实上,这只是冰山一角,我会尽力向你展示他的一些优点。

走在前面的步骤,现在让我们进入ARR直接回到汽车。



不管它是否悬空,您现在可以直接单击对象来扩展这个数组中的对象来检查,甚至保存循环输出。

这就是控制台的魅力,这就是他的基本功能。

让我们首先了解控制台对象和我们使用的方法。

输入控制台,然后返回到汽车并展开对象。


我们能看到一些黑暗和光明的东西。黑色是我们直接调用的方式。浅色表示默认属性或方法,不需要关心,以后有机会。

事实上,只有日志目录才被使用,其他的诚意很少被使用,高级调试将会被使用。

组,表和其他辅助属性,可以用来看你喜欢。我不喜欢使用它非常。

我们一步一步地从日志目录开始,大部分调试取决于它们。

西蒙兹:事实上,它应该给你的官方文件,但最近谷歌不能打开它,所以百度将查看每种方法的功能。



找到中文版本很好,您首先看到了控制台对象。

课后练习:(先打开百度,然后打开控制台)

1视图的ID的元素信息kw1在控制台

2然后用console.dir方法查看的kw1元信息