因为要弄某网页的一个自动登陆工具,所以需要对此网页中的元素利用js进行选取和操作,复杂的js选取如果直接在头脑中想很容易出错,而且一旦出错也不好判断错误原因.

而浏览器带的开发者工具的控制台功能,就给我们提供了一个像在本地开发工具中调试程序一样便捷的功能.

比如要调试博客首页,鼠标右键选择页面中对应的元素,弹出的菜单选择审查元素:

假设我们要选取图中标题的a标签元素,它的id为homepage1_HomePageDays_DaysList_ctl00_DayList_TitleUrl_0,那么我们切换到控制台:

直接输入js的选取语句后回车,就能看到输入语句的执行结果..可以对当前页面进行实时的js脚本操作..非常方便快捷..

巧用开发者工具的控制台来调试页面中的js语句的更多相关文章

  1. 使用Spring Boot开发者工具进行自动重启和页面自动刷新

    简介 大家可能都听说过开发Node.js应用时可以使用多种工具对开发者提供便利,如WebPack提供了开发者服务器来支持js应用动态更替,并在保存文件时自动刷新浏览器.Spring Boot也提供了相 ...

  2. 【译】在 Chrome 开发者工具中调试 node.js

    原文链接 : Debugging Node.js in Chrome DevTools 原文作者 : MATT DESLAURIERS 译文出自 : 掘金翻译计划 译文链接 : https://git ...

  3. 利用google浏览器开发者工具调试网页（详）

    前端程序员或者在校大学生正在开发网页,如果想要测试或者通过测试优化网页结构,该怎么办呢?这就需要用到一款工具,chrome浏览器的开发者工具?本文写给尚不熟悉这个开发者工具的同学们或者同行们,话不多说 ...

  4. 使用 Chrome 开发者工具进行 JavaScript 问题定位与调试

    转自:https://www.ibm.com/developerworks/cn/web/1410_wangcy_chromejs/ 引言 Google Chrome 是由 Goole 公司开发的一款 ...

  5. 使用微信web开发者工具调试微信企业号页面（前端页面，已发布在服务器上的）

    前几天写了一篇使用fiddler调试微信端页面的,然后博友评论说使用fiddler太麻烦了,推荐使用微信web开发者工具调试微信页面,这两天弄着玩了一下,很强大.这篇文章只是做一个记录,方便自己以后使 ...

  6. 微信web开发者工具调试

    微信web开发者工具调试 前几天写了一篇使用fiddler调试微信端页面的,然后博友评论说使用fiddler太麻烦了,推荐使用微信web开发者工具调试微信页面,这两天弄着玩了一下,很强大.这篇文章只是 ...

  7. chrome谷歌开发者工具（hover时候的css样式怎么在浏览器调试）

    很多小伙伴在开发的时候,大多是在用谷歌开发者工具调试代码(快捷键F12 或 Ctrl-Shift-i). 可能会经常遇到需要调试hover样式的时候,一般都是直接改代码,然后在页面上刷新查看效果. 其 ...

  8. H5 页面调试小帮手-UC 开发者工具

    调试web页面难 接触过app自动化的同学都比较清楚,如果想要对web应用或者Hybrid应用进行调试时(获取页面元素信息等等),必定绕不开的就是chrome浏览器的inspect功能了:在chrom ...

  9. 利用微信web开发者工具调试企业微信页面

    1.只有企业号的管理员才能调试. 2.勾选企业号的开发者工具(具体位置见下图,这个入口位置总是在变,一般来说,找到”微工作台“就能找到了) 3.下载web开发者工具 https://developer ...

随机推荐

  1. 怎样从C#中打开数据库并进行 增 删 改 查 操作

    首先 在C#中引用数据库的操作! (因为我们用的是SQLserver数据库,所以是SqlClient) using System.Data.SqlClient; 1:要实现对数据库的操作,我们必须先登 ...

  2. 自制奇葩vb面试题，看你能对几道

    这些题都比较奇葩,所以做出选择之前请仔细考虑. 答题过程中不要离开当前页面,不要去试代码,也不要查参考或问别人. 转载请说明作者是 Nukepayload2 Vb版本:14 默认的.net frame ...

  3. 最小生成树Prim算法（邻接矩阵和邻接表）

    最小生成树,普利姆算法． 简述算法: 先初始化一棵只有一个顶点的树,以这一顶点开始,找到它的最小权值,将这条边上的令一个顶点添加到树中 再从这棵树中的所有顶点中找到一个最小权值(而且权值的另一顶点不属 ...

  4. jsp iframe example

    1. jsp中用iframe的方式在body中展示列表, 可以通过父元素的宽.高来设定iframe的宽高. <div class="wrapper" style=" ...

  5. web安全——防火墙

    简介 用于实现服务器(Linux)的访问控制的功能的. 分硬件和软件防火墙. 主要是控制访问的流入和服务器的流出. 通过黑名单和白名单的思想来实现更细粒度的控制,这个一般结合其他的应用来定义策略实现. ...

  6. Ansible用于网络设备管理 part 1 Jinja2 YAML初窥

    这一次的实验内容依然来自Kirk Byers的博客,源地址在https://pynet.twb-tech.com/blog/python/paramiko-ssh-part1.html 但是,这次实验 ...

  7. Jquery学习—jquery的事件

    1.Jquery事件1:one 1)one() 方法是为所选的元素绑定一个仅出发一次的处理函数,调用格式 one(type,[data],fn) 2)其中参数type是事件类型,即需要触发什么类型的事 ...

  8. CMD和AMD

    CMD是国内玉伯在开发SeaJS的时候提出来的,属于CommonJS的一种规范,此外还有AMD,其对于的框架是RequireJS. 二者的异同之处: 二者都是异步(Asynchronuous Modu ...

  9. ArcGIS Add-in——自动保存编辑

    需求:由于初次使用ArcGIS编辑器不习惯.数据量大造成经常程序未响应.计算机断电等因素,造成编辑的数据没有保存,影响了生产效率,本人根据草色静然的博文,总结了自动保存编辑的实现方法. 分析:自动保存 ...

  10. English Training Material - 01

    Building a relationship Cross-cultural understanding Eye contact In many Western societies, includin ...