【HTML5与CSS3基础】开发者工具之Console

最新推荐文章于 2022-06-15 18:52:25 发布

zgljl2012

最新推荐文章于 2022-06-15 18:52:25 发布

阅读量1.9k

点赞数 1

分类专栏： Web前端文章标签： html5 CSS3 console 开发者工具

本文链接：https://blog.csdn.net/zgljl2012/article/details/45000191

版权

Web前端专栏收录该内容

18 篇文章 1 订阅

订阅专栏

现在的浏览器往往都会有一个开发者工具用于帮助开发者构建更高效的网站。

开发者工具有一个Console窗口（控制台窗口）用于输出一些调试信息，有了这个工具就总算是可以告别使用alert来调试JavaScript了。而且Console的功能远远不只是输出一下现在运行到哪了这样的简单的信息，它还可以识别不同种类的信息并且提供对应代码的超链接。

开发者工具是通过把一个名为console的对象加载到全局名称空间中，使用这个对象就可以将应用程序内部的工作信息输出到Console控制台。下面是7个console对象的方法，方法功能在注释里介绍：

<!DOCTYPE html>
<html>
  <head>
    <meta content="text/html; charset=gbk" http-equiv="content-type">
    <title>console.log</title>
  </head>
  <body>
    <script>
      console.log("test-log");        //向控制台输出一条信息
      console.debug("test-debug");    //输出信息，并会有一个超链接链接到代码
      console.info("test-info");      //输出一个信息的图标和信息
      console.warn("test-warn");      //输出一个警告的图标和警告信息
      console.error("test-error");    //输出一个错误的图标和错误信息
      console.assert(3<2);            //断言错误会在控制台显示，正确则不会显示
      //console.clear();              //清除控制台信息
    </script>
  </body>
</html>