JavaScript实现浏览器网页自动滚动并点击的示例代码


Posted in Javascript onDecember 05, 2020

1. 打开浏览器控制台窗口

JavaScript通常是作为开发Web页面的脚本语言,本文介绍的JavaScript代码均运行在指定网站的控制台窗口。一般浏览器的开发者窗口都可以通过在当前网页界面按F12快捷键调出,然后在上面的标签栏找到Console点击就是控制台窗口,在这里可以直接执行JavaScript代码,而chrome系浏览器的控制台界面可以使用快捷键Ctrl+Shift+J直接打开

2. 实时查看鼠标坐标

首先为了获取当前的鼠标位置的x、y坐标,需要先重写一个onmousemove函数来帮助我们实时查看光标处的x、y值,方便下一步编写代码时确定初始的y坐标和每次y方向滚动的距离

// 在控制台输入以下内容并回车,即可查看当前鼠标位置
// 具体查看方式:鼠标在网页上滑动时无效果,当鼠标悬停时即可在光标旁边看到此处的坐标
document.onmousemove = function(e){
 var x = e.pageX;
 var y = e.pageY;
 e.target.title = "X is "+x+" and Y is "+y;
};

3. 编写自动滚动代码

具体代码如下,将代码粘贴进控制台并回车,然后调用auto_scroll()函数(具体参数含义在代码注释查看)即可运行

// y轴是在滚动的,每次不一样;x坐标也每次从这些里面随机一个
var random_x = [603, 811, 672, 894, 999, 931, 970, 1001, 1037, 1076, 1094];
// 初始y坐标
var position = 200;
// 最大执行max_num次就多休眠一下
var max_num = 20;
// 单位是秒,每当cnt%max_num为0时就休眠指定时间(从数组中任选一个),单位是秒
var sleep_interval = [33, 23, 47, 37, 21, 28, 30, 16, 44];
// 当前正在执行第几次
var cnt = 0;

// 相当于random_choice的功能
function choose(choices)
{
 var index = Math.floor(Math.random() * choices.length);
 return choices[index];
};

// 相当于广泛的random,返回浮点数
function random(min_value, max_value)
{
 return min_value + Math.random() * (max_value - min_value);
};

// 模拟点击鼠标
function click(x, y)
{
 // x = x - window.pageXOffset;
 // y = y - window.pageYOffset;
 y = y + 200;
 try {
  var ele = document.elementFromPoint(x, y);
  ele.click();
  console.log("坐标 ("+x+", "+y+") 被点击");
 } catch (error) {
  console.log("坐标 ("+x+", "+y+") 处不存在元素,无法点击")
 }
};

// 定时器的含参回调函数
function setTimeout_func_range(time_min, time_max, step_min, step_max, short_sleep=true)
{
 if(cnt<max_num)
 {
  cnt = cnt + 1;
  if(short_sleep)
  {
   // 短休眠
   position = position + random(step_min, step_max);
   x = choose(random_x);
   scroll(x, position);
   console.log("滚动到坐标("+x+", "+position+")");
   click(x, position);
   time = random(time_min, time_max)*1000;
   console.log("开始" + time/1000 + 's休眠');
   setTimeout(setTimeout_func_range, time, time_min, time_max, step_min, step_max);
   // console.log(time/1000 + 's休眠已经结束');
  }else
  {
   // 长休眠,且不滑动,的回调函数
   time = random(time_min, time_max)*1000;
   console.log("开始" + time/1000 + 's休眠');
   setTimeout(setTimeout_func_range, time, time_min, time_max, step_min, step_max);
   // console.log(time/1000 + 's休眠已经结束');
  }
 }else
 {
  cnt = 0;
  console.log("一轮共计"+max_num+"次点击结束");
  time = choose(sleep_interval)*1000;
  console.log("开始" + time/1000 + 's休眠');
  setTimeout(setTimeout_func_range, time, time_min, time_max, step_min, step_max, false);
  // console.log(time/1000 + 's休眠已经结束(长休眠且不滑动)');
 }
};

// 自动滚动网页的启动函数
// auto_scroll(5, 10, 50, 200)表示每隔5~10秒滚动一次;每次滚动的距离为50~200高度
function auto_scroll(time_min, time_max, step_min, step_max)
{
 time = random(time_min, time_max)*1000;
 console.log("开始" + time/1000 + 's休眠');
 setTimeout(setTimeout_func_range, time, time_min, time_max, step_min, step_max);
 // console.log(time/1000 + 's休眠已经结束');
};

/*
---------以下内容无需用到,根据情况使用----------
// 自定义click的回调函数
// 若绑定到元素,则点击该元素会出现此效果
function click_func(e)
{
 var a = new Array("富强","民主","文明","和谐","自由","平等","公正","法治","爱国","敬业","诚信","友善");
 var $i = $("<span></span>").text(a[a_idx]);
 a_idx = (a_idx + 1) % a.length;
 var x = e.pageX,
 y = e.pageY;
 $i.css({
  "z-index": 999999999999999999999999999999999999999999999999999999999999999999999,
  "top": y - 20,
  "left": x,
  "position": "absolute",
  "font-weight": "bold",
  "color": "rgb("+~~(255*Math.random())+","+~~(255*Math.random())+","+~~(255*Math.random())+")"
 });
 $("body").append($i);
 $i.animate({
  "top": y - 180,
  "opacity": 0
 },
 1500,
 function() {
  $i.remove();
 });
};


// 在控制台输入以下内容,即可查看当前鼠标位置
document.onmousemove = function(e){
 var x = e.pageX;
 var y = e.pageY;
 e.target.title = "X is "+x+" and Y is "+y;
};
*/

代码运行效果如下

JavaScript实现浏览器网页自动滚动并点击的示例代码

以上就是JavaScript实现浏览器网页的自动滚动并点击的示例代码的详细内容,更多关于JavaScript 浏览器自动滚动点击的资料请关注三水点靠木其它相关文章!

Javascript 相关文章推荐
Js event事件在IE、FF兼容性问题
Jan 01 Javascript
EasyUI中的tree用法介绍
Nov 01 Javascript
Extjs4 关于Store的一些操作(加载/回调/添加)
Apr 18 Javascript
原生JavaScript实现连连看游戏(附源码)
Nov 05 Javascript
jQuery同步提交示例代码
Dec 12 Javascript
Javascript实现的SHA-256加密算法完整实例
Feb 02 Javascript
Angularjs手动解析表达式($parse)
Oct 12 Javascript
浅谈JS函数节流防抖
Oct 18 Javascript
原生javascript AJAX 三级联动的实现代码
May 04 Javascript
Vue 组件封装 并使用 NPM 发布的教程
Sep 30 Javascript
详解JavaScript原生封装ajax请求和Jquery中的ajax请求
Feb 14 jQuery
vue实现按需加载组件及异步组件功能
May 27 Javascript
解决vue下载后台传过来的乱码流的问题
Dec 05 #Vue.js
js获取图片的base64编码并压缩
Dec 05 #Javascript
js重写alert事件(避免alert弹框标题出现网址)
Dec 04 #Javascript
可拖拽组件slider.js使用方法详解
Dec 04 #Javascript
js实现复制粘贴的两种方法
Dec 04 #Javascript
echarts浮动显示单位的实现方法示例
Dec 04 #Javascript
JavaScript中条件语句的优化技巧总结
Dec 04 #Javascript
You might like
PHP实现多服务器session共享之NFS共享的方法
2007/03/16 PHP
PHP使用MPDF类生成PDF的方法
2015/12/08 PHP
PHP自带方法验证邮箱是否存在
2016/02/01 PHP
Zend Framework分发器用法示例
2016/12/11 PHP
PHP 配置后台登录以及模板引入
2017/01/24 PHP
javascript之卸载鼠标事件的代码
2007/05/14 Javascript
腾讯的ip接口 方便获取当前用户的ip地理位置
2010/11/25 Javascript
FF IE浏览器修改标签透明度的方法
2014/01/27 Javascript
ExtJs纵坐标值重复问题的解决方法
2014/02/27 Javascript
删除条目时弹出的确认对话框
2014/06/05 Javascript
jQuery实现优雅的弹窗效果(6)
2017/02/08 Javascript
IE11下使用canvas.toDataURL报SecurityError错误的解决方法
2017/11/19 Javascript
elementUI中Table表格问题的解决方法
2018/12/04 Javascript
学前端,css与javascript重难点浅析
2020/06/11 Javascript
jquery实现异步文件上传ajaxfileupload.js
2020/10/23 jQuery
在Python的Django框架中获取单个对象数据的简单方法
2015/07/17 Python
Python中关键字nonlocal和global的声明与解析
2017/03/12 Python
python 中random模块的常用方法总结
2017/07/08 Python
Python内置模块turtle绘图详解
2017/12/09 Python
python opencv minAreaRect 生成最小外接矩形的方法
2019/07/01 Python
Python3 合并二叉树的实现
2019/09/30 Python
用python制作个音乐下载器
2021/01/30 Python
Python3.9.1中使用match方法详解
2021/02/08 Python
CSS3 中filter(滤镜)属性使用详解
2020/04/07 HTML / CSS
CSS3实现淘宝留白的方法
2020/06/05 HTML / CSS
史泰博(Staples)中国官方网站:办公用品一站式采购
2016/09/05 全球购物
凯撒娱乐:Caesars Entertainment
2018/02/23 全球购物
荷兰包包购物网站:The Little Green Bag
2018/03/17 全球购物
ASOS比利时:英国线上零售商及自有品牌
2018/07/29 全球购物
集团公司总经理岗位职责
2013/12/20 职场文书
珍惜水资源建议书
2014/03/12 职场文书
财会专业毕业生自荐信
2014/07/09 职场文书
劳动纠纷调解协议书格式
2014/11/30 职场文书
校车安全管理责任书
2015/05/11 职场文书
Nginx代理同域名前后端分离项目的完整步骤
2021/03/31 Servers
mysql 8.0.24版本安装配置方法图文教程
2021/05/12 MySQL