Chrome浏览器 Console调试台的简单使用
打开调试台
方法1:在chrome浏览器中打开网页,按下F12,点击下图框选内容。

方法2: 浏览器中鼠标右键选择查看网页源代码后,再按上图操作。

调试台的功能
(因为是第一次使用这个调试台,只能罗列一些简单的功能,但用于调试JavaScript代码足够了。)
1、console.log(name);
// 作用是在调试台中显示name的值(在js中调用)
<script type="text/javascript">
var name='Hbuilder';
console.log(name);
</script>
运行截图:(打开调控台,直接就能将num的值输出。)

2、调用js中的function()函数:
<script type="text/javascript">
var sum=function(a,b){
var c=a+b;
console.log(c);
}
</script>
运行截图:

3、查找HTML的标签和其它元素
网页源代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
<div id="d0" class="div">这是一个div</div>
</body>
</html>
例如查找id='d0'的标签:

小技巧:
调试台写满了,点击箭头位置就能将它清空。

Chrome浏览器 Console调试台的简单使用的更多相关文章
- chrome 浏览器 console 加入 jquery 测试调试 一介布衣
chrome 浏览器 console 加入 jquery 测试调试 一介布衣 var jquery = document.createElement('script'); jquery.src = ...
- Chrome浏览器及调试教程
==>(微信公众号:IT知更鸟)欢迎关注<^>@<^> Chrome浏览器及调试教程 在web开发过程中,我们在写JavaScript脚本时难免会遇到各种bug,这时,我 ...
- [转]chrome浏览器中 F12 功能的简单介绍
本文转自:https://www.cnblogs.com/zhuzhubaoya/p/9758648.html chrome浏览器中 F12 功能的简单介绍 由于F12是前端开发人员的利器,所以我自己 ...
- 【F12】chrome浏览器中 F12 功能的简单介绍
chrome浏览器中 F12 功能的简单介绍 由于F12是前端开发人员的利器,所以我自己也在不断摸索中,查看一些博客和资料后,自己总结了一下来帮助自己理解和记忆,也希望能帮到有需要的小伙伴,嘿嘿! 首 ...
- chrome浏览器中 F12 功能的简单介绍
chrome浏览器中 F12 功能的简单介绍 由于F12是前端开发人员的利器,所以我自己也在不断摸索中,查看一些博客和资料后,自己总结了一下来帮助自己理解和记忆,也希望能帮到有需要的小伙伴,嘿嘿! 首 ...
- Chrome浏览器开发调试系列(一)
// 计划写一个 Chrome 浏览器以及 调试器的系列文章,我慢慢写. 边写边改,发觉博客真是个打草稿的好地方. // 本文针对的是当前最新的浏览器Chrome34,如果你的版本不够新,希望你能够更 ...
- chrome浏览器console拓展用法
chrome 浏览器console打印 使用CSS美化输出信息 console.log("%cThis will be formatted with large, blue text&quo ...
- 利用ChromeCROSS可以在chrome浏览器上调试跨域代码
利用ChromeCROSS可以在chrome浏览器上调试跨域代码 1.下载ChromeCROSS文件,可百度下载,或者在我的百度云上下载:链接: https://pan.baidu.com/s/10_ ...
- Chrome浏览器如何调试移动端网页信息
Chrome浏览器如何调试移动端网页信息 2017年08月12日 12:42:20 阅读数:835 最近在弄项目,用WebView加载一个页面,想追踪页面中一个按钮的点击事件.这个可能就需要调试这个页 ...
随机推荐
- 关于php中数据提交到当前页面action的问题
关于php中数据提交到当前页面action的问题 2011-06-21 17:45杨超★杰伦 | 分类:PHP | 浏览695次 php中数据提交到当前页面,有人action=“<?php ec ...
- TCO14286 TriangleTriples
题目链接:https://vjudge.net/problem/TopCoder-14286 知识点: 组合数学.容斥原理 题目大意: 给出 \(A,B,C\),问有多少个有序三元组 \((a,b,c ...
- 【Nginx】centos7 yum命令安装nginx
安装nginx 首先我们需要使用root用户进行操作 第一步:添加nginx存储库 sudo yum install epel-release 出现如下图说明成功: 第二步:安装nginx sudo ...
- airflow的安装和使用 - 完全版
之前试用了azkaban一小段时间,虽然上手快速方便,但是功能还是太简单,不够灵活. Airflow使用代码来管理任务,这样应该是最灵活的,决定试一下. 我是python零基础,在使用airflow的 ...
- 关于VMware问题:无法获得 VMCI 驱动程序的版本: 句柄无效。驱动程序“vmci.sys”的版本不正确
有的童鞋可能安装虚拟机时出现了下边这样的错误,莫慌,下面咋们来解决!!! 1.首先,找到你的安装虚拟机的目录下有一个.vmx的文件 找到这个文件,用编辑器打开,将该值改为FALSE即可!
- Java四种访问修饰符
Java 四种访问权限 一.概述 访问等级比较:public > protected > default > private 无论是方法还是成员变量,这四种访问权限修饰符作用都一样 ...
- eatwhatApp开发实战(六)
上次,我们为app添加了本地存储的功能,但会发现一但退出app则存储的商家集合就消失,但其实本地已经存储了记录只是没去读取罢了. 接下来我们来实现这个功能. /** * 获取本地数据 */ priva ...
- 如何管理win系列服务器,win10 pro如何 使用远程桌面
远程桌面,大家都理解,专业的运维人员都是连接上百台服务器进行操作管理工作. 先介绍一款专业的远程桌面管理工具:iis7远程桌面批量管理 win10 pro如何 使用远程桌面? 一. 首先在win10 ...
- (Java实现) 零件分组
零件分组(Stick)-动态规划-中高级 Case Time Limit:1000MS Time Limit: 3000MS Memory Limit: 65536K Total Submission ...
- Java实现洛谷 P1873 砍树(StreamTokenizer+IO+二分)
P1873 砍树 输入输出样例 输入 5 20 4 42 40 26 46 输出 36 PS: get新知识,以前只知道STringTokenizer并没有了解过StreamTokenizer,这次才 ...