如何查看网页元素使用的js

已于 2022-10-19 11:43:43 修改
阅读量2.8w 收藏 19
点赞数 6
文章标签： javascript 前端 html
于 2018-08-17 20:41:55 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/mo3408/article/details/81783038
版权
本文介绍了查看网页元素所用JS的两种方法。一种是使用VisualEvent插件，将其直接拖拽到浏览器（如Chrome或360浏览器）安装，通过插件可以直观看到元素对应的JS。另一种方法是通过浏览器的开发者工具，打开控制台，点击Event开头的条目来查看元素关联的JS代码。
摘要由CSDN通过智能技术生成

第一种方法： 

1.VisualEvent

下载地址：插件下载

2.使用方法：直接将.crx文件拖到浏览器（目前只支持与谷歌浏览器内核一样的浏览器，360浏览器也可以），如果没有效果，找到扩展管理或者管理，然后在拖动就行。（建议谷歌浏览器）

3截图：

 

一般就是上面的效果,这样就能查看到js

第二种方法：

例如我们想查看京东导航的js

调出控制台，点击右边的Event开头的，里面是元素所包含的js.

瑆箫
关注
专栏目录
订阅专栏
网页中通过调试工具查看js代码
qq_44403367的博客
04-02 3396
如何最快速的找到页面某一元素所绑定的点击事件，并查看js代码 该文转载而来，作者是jmd88888888 https://blog.csdn.net/jmd88888888/article/details/70919378
如何快速找出网页中事件对应的js代码片段
weixin_34315189的博客
04-01 5111
后端人员也免不了要处理一些前端的事情，由于代码不是自己写的，所以不好找到相关的代码。 比如在表单提交时，前端提交的数据不正确，这时候你可能会想在谷歌浏览器里添加一个鼠标 点击事件的断点。 然而查看js的调用堆栈你会发现，傻眼了，一大堆jquery或其它js库的代码。 怎么办呢？ 使用浏览器自带的blackbox，即把不需要的放到黑盒里 1、先打开开发者工具，然后选择设置，如下 2、添加排除的...
前端JavaScript（JS）基础介绍
最新发布
chencxiaobai的博客
08-05 577
JS简介、基础语法、函数、对象、事件
如何查看一个网页特定效果的js代码（动画效果可js和css）（页面可以看到js的源代码）...
weixin_33985679的博客
05-26 6129
如何查看一个网页特定效果的js代码（动画效果可js和css）（页面可以看到js的源代码） 一、总结 1、动画效果可能是 CSS 实现的，也可能是 JS 实现的。 2、直接Chrome的F12调试即可， 页面可以看到js的源代码的   二、如何查看一个网页特定效果的js代码 问题: 如何查看一个网页中特定效果的js代码～？比如鼠标悬浮有个动画效果如何查看对应的js代码？   解答：...
JS 获取网页源代码
热门推荐
kubaoer的专栏
10-24 2万+
远程网页源代码读取 /* 页面字体样式 */ body, td, input, textarea { font-family:Arial; font-size:12px; } //用于创建XMLHttpRequest对象 function createXmlHttp() { //根据window.XMLHttpRequest对象是否存在使
如何查看网页操作中调用的js方法
wchwdog13的博客
06-13 1万+
​比如点击网页中的某个按钮时，如何知道调用了哪个js方法。 首先打开谷歌浏览器，按f12进开发者模式，然后点击source选项卡。 ​找到event listener breakpoints，选择相应的选项后，再从页面中执行相应的动作后，即可显示出调用的js。 ...
如何查找元素对应事件的js代码
weixin_30725467的博客
05-29 326
以chrome的firebug为例 1.找到其dom元素,然后右键"break on"-->"subtree modification"等,设置后元素旁边会有蓝色小圆点 三个属性分别是 Subtree modification : 结构修改 Attributes modifications : 属性改变 Node removeal : 节点移除 2.右边是设置...
【JavaScript】获取网页元素
m0_63235356的博客
08-27 1353
分别获取body和html,全局仅有一个,比较特殊.格式固定,元素名可以自己另外起。
JavaScript驾驭网页－获取网页元素
10-22
驾驭网页的核心之一就是如何使用JavaScript来获取和控制网页元素。本文将详细介绍如何使用JavaScript来获取网页元素，并对相关知识点进行详细说明。 ### 获取网页元素 #### 使用getElementById() HTML标签都可以...
JS禁止浏览器右键查看元素或按F12审查元素自动关闭页面示例代码
01-19
很多站长为了仿止别人仿制或扒下自己的网页，都会选择使用禁止浏览器右键查看元素或F12审查元素，一旦查看元素浏览器页面就会自动关闭，下面话不多说了，来一起看看详细的介绍吧。 注：该代码不兼容火狐浏览器，对于...
用JS实现网页元素阴影效果的研究总结
10-30
这篇文章是关于如何使用JavaScript实现网页元素阴影效果的研究总结。作者在尝试为网页元素添加阴影时，发现需要处理浏览器之间的兼容性问题，特别是IE、Firefox、Opera等不同浏览器对CSS和JavaScript的支持差异。...
网页设计作业，使用html、js、css基础元素实现
01-16
在压缩包文件"web网页大作业"中，可能包含了HTML文件（如index.html）、CSS文件（如styles.css）和JavaScript文件（如script.js），以及可能的图像和其他资源文件。通过编辑和测试这些文件，学生将逐步构建出一个...
如何找出网页中事件对应的js代码，不用审查元素。
qq_44403367的博客
04-03 3059
2020/04/03 JavaScript学习，找出事件中所对应的js代码。
js获取页面元素的 7种方法
jerisem的博客
07-31 8581
1、通过ID来获取页面元素： document.getElementById('id'); <div id='box'></div> <script> let box = document.getElementById('box'); console.log(box); // 输出是整条语句 <div id='box'></div> </script>
介绍一下主流的浏览器的开发者工具(js调试和查看网络请求）
pythonxxoo的博客
01-16 1716
Python微信订餐小程序课程视频 https://edu.csdn.net/course/detail/36074 Python实战量化交易理财系统 https://edu.csdn.net/course/detail/35475 1、打开开发者工具：右键–>检查 (快捷键 f12) 2、开发者工具介绍： （1）： 选择页面的dom进行查看 （2）：设备适配 （3）元素： ① 可以查找到界面对应的dom； ② 通过计算样式，查看盒模型； ③ 在元素上选择右键，还可以：[当我们看到某个网站的css样
如何获取页面元素对应JavaScript对象
ANFO的博客
11-07 577
一.前言 在HTML 文档中，所有内容都是节点： 1.整个文档是一个文档节点； 2.每个 HTML 元素是元素节点； 3.HTML 元素内的文本是文本节点； 4.每个 HTML 属性是属性节点； 5.注释是注释节点； 而获取文档中这些节点，也就是页面元素对应的JavaScript对象，也叫DOM对象，就需要使用document对象。 二.四种获取方式 1.通过标签的id获取该标签...
js页面使用element-ui
qq_47793359的博客
11-03 1569
js手写样式很麻烦，表格，表单画的很头疼，想用ui框架怎么办？别慌~~~下面分享下个人以element-ui在js项目里面使用的一些浅薄的经验。。。
js添加网页元素
05-25
要在网页中添加元素，可以使用JavaScript的DOM操作。以下是一个简单的例子： ```html <!DOCTYPE html> <html> <head> <title>添加元素</title> </head> <body> <button onclick="addParagraph()">添加段落</button> <script> function addParagraph() { var para = document.createElement("p"); var node = document.createTextNode("这是一个新段落。"); para.appendChild(node); var element = document.getElementById("div1"); element.appendChild(para); } </script> <div id="div1"></div> </body> </html> ``` 这个例子中，我们创建了一个按钮，点击按钮会调用JavaScript函数`addParagraph()`。在这个函数中，我们首先创建了一个新的`<p>`元素，然后创建了一个文本节点，并将其添加到`<p>`元素中。接着，我们找到了一个具有`id="div1"`的`<div>`元素，并将新的`<p>`元素添加到其中。 这只是DOM操作的一个简单示例，实际上可以使用JavaScript创建和修改网页中的任何元素。
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

瑆箫

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值