利用 JS 脚本实现网页全自动秒杀抢购

倒计时页面：

倒计时未结束时，购买按钮还不能点击。

结束时，可以点击购买，点击后出现提示“付款成功”

展示效果

1.制作测试网页

首先我们来做一个简易的抢购页面

<!DOCTYPE html>

<html lang="zh_CN">

<head>

    <meta charset="UTF-8">

    <title>Apple</title>

    <style type="text/css">

        body {

            background-color: black;

        }

        #hOne{

            color: white;

            font-size: 50px;

            font-family: PingFangSC-Regular, sans-serif;

            line-height: 1px;

            width: 100%;

            text-align: center;

        }

        #hTwo{

            color: #d01f2a;

            font-size: 20px;

            text-align: center;

        }

        #hThree{

            color: white;

            font-size: 30px;

            line-height: 30px;

            font-family: PingFangSC-Regular, sans-serif;

            text-align: center;

        }

        #div1 {

            color: white;

            margin: auto;

        }

        #endTime {

            color: #2997ff;

        }

        img {

            width: 228px;

            height: 366px;

            border: 0px;

        }

    </style>

</head>

<body>

<br /><br />

<h1 id="hOne"> WATCH</h1>

<h2 id="hTwo">S E R I E S  6</h2>

<h3 id="hThree">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;健康的未来，现在戴上。</h3>

<div align="center" id="div1">

    <img src="apple%20watch.jpeg">

    <p id="time">预售倒计时 <span id="endTime"></span> 秒！</p>

    <input type="button" id="btn" value="立即购买" disabled="disabled"><br />

</div>

</body>

</html>

展示一下：

2.倒计时及购买功能的实现

我们使用的是jQuery框架，jQuery 极大地简化了 JavaScript 编程。

<script type="text/javascript" src="script/jquery-1.7.2.js"></script> // 导入jquery

<script type="text/javascript">

        $(function () {

            var timeElement = $("#endTime")[0]; // 获得倒计时dom对象

            var  i = 10;

            function remainTime() {

                if (i > 0) {

                    timeElement.innerHTML = i--;

                    setTimeout(function () {

                        remainTime();

                    }, 1000);

                }

                if (i == 0) {

                    $("#time")[0].innerHTML = "在线选购开始";

                    $("#time").css({color: "#2997ff"});

                    $("#btn")[0].disabled = false; // 倒计时结束，按钮可以点击

                }

            }

            remainTime();

            $("#btn").click(function () { // 点击事件

                alert("我们已收到您的付款，正在处理您的订单");

            });

        });

</script>

3.使用 JS 脚本实现自动抢购功能

（1）在浏览器中打开开发者工具

​

（2）找到按钮元素标签所在位置

（3）JS 抢购脚本
var btnObj = document.getElementById("btn"); // 第二步中可知 id=“btn"

var timer = setInterval(function () {

                if (btnObj.disabled == false) { // 当按钮可以点击时

                    btnObj.click();		//点击

                    clearInterval(timer); // 选购完成后关闭timer，否则将一直购买，土豪随意

                }

            });
（4）在控制台中运行 JS脚本

看懂第三步的代码后，就可以在控制台中运行了

将第三步的代码复制粘贴到控制台中

注意：控制台中Enter为运行， Enter + Shift为换行， 脚本应在倒计时结束前注入

最终结果

可以参考学习，切勿拿来做有违道德，谋取利益的事。

利用 JS 脚本实现网页全自动秒杀抢购的更多相关文章

  1. 利用JS脚本通过getAttribute（）和setAttribute（）等对CSS样式进行操作

    HTML中引入CSS样式的方式有三种: 1.最常用的,引入样式表,在样式表中编写样式,引入方式如下:<link href="css/style.css" rel=" ...

  2. Selenium2+python自动化-使用JS脚本处理网页滚动条

    内容来自:https://www.cnblogs.com/yoyoketang/p/6128655.html JS相关知识:http://www.w3school.com.cn/js/index.as ...

  3. 前端JS脚本将网页表格导出为Excel

    话不多说,上代码! <!DOCTYPE> <html> <head> <title>Excel Test</title> </head ...

  4. 关于写作那些事之利用 js 统计各大博客阅读量

    在日常文章数据统计的过程中,纯手动方式已经难以应付,于是乎,逐步开始了程序介入方式进行统计. 在上一节中,探索利用 csv 文件格式进行文章数据统计,本来以为能够应付一阵子,没想到仅仅一天我就放弃了. ...

  5. 用js脚本一键下载网页所有图片

    年前这两天稍微闲一点了,琢磨了一点js脚本,功能是把当前网页页面上的所有图片一次性保存到本地,免得每次都要对图片右键保存. 测试环境:Chrome开发者模式下(启动Chrome,按F12即可) 测试网 ...

  6. 【转】第5篇：Xilium CefGlue 关于 CLR Object 与 JS 交互类库封装报告：自动注册JS脚本+委托回调方法分析

    作者: 牛A与牛C之间 时间: 2013-11-19 分类: 技术文章 | 暂无评论 | 编辑文章 主页 » 技术文章 » 第5篇:Xilium CefGlue 关于 CLR Object 与 JS ...

  7. 【转】第6篇：Xilium CefGlue 关于 CLR Object 与 JS 交互类库封装报告：自动注册JS脚本+自动反射方法分析

    作者: 牛A与牛C之间 时间: 2013-11-21 分类: 技术文章 | 暂无评论 | 编辑文章 主页 » 技术文章 » 第6篇:Xilium CefGlue 关于 CLR Object 与 JS ...

  8. JS一般般的网页重构可以使用Node.js做些什么（转）

    一.非计算机背景前端如何快速了解Node.js? 做前端的应该都听过Node.js,偏开发背景的童鞋应该都玩过. 对于一些没有计算机背景的,工作内容以静态页面呈现为主的前端,可能并未把玩过Node.j ...

  9. 利用Crowbar抓取网页异步加载的内容 [Python俱乐部]

    利用Crowbar抓取网页异步加载的内容 [Python俱乐部] 利用Crowbar抓取网页异步加载的内容 在做 Web 信息提取.数据挖掘的过程中,一个关键步骤就是网页源代码的获取.但是出于各种原因 ...

随机推荐

  1. python学习笔记回忆录02

    1.for循环 依次按顺序从列表中取出值,直到遍历完整个列表为止 the_count =[1,2,3,4,5] for number in the_count: print "this is ...

  2. Combine 框架，从0到1 —— 4.在 Combine 中使用通知

      本文首发于 Ficow Shen's Blog,原文地址: Combine 框架,从0到1 -- 4.在 Combine 中使用通知.   内容概览 前言 让通知处理代码使用 Combine 总结 ...

  3. C++——大小写转换

    代码如下: #include <iostream> using namespace std; int main() { char ch; cin>>ch; if(ch>' ...

  4. Java中String.strip()和String.trim()方法

    strip和trim String.trim() 可以去除字符串前后的"半角"空白字符 String.strip() 可以去除字符串前后的"全角和半角"空白字符 ...

  5. 一起来读官方文档-----SpringIOC（03）

    1.4.依存关系 典型的企业应用程序不坑你只包含单个对象或单个bean.即使是最简单的应用程序,也有一些对象可以协同工作,以呈现最终用户视为一致的应用程序.下一部分将说明如何从定义多个独立的Bean定 ...

  6. CentOS 7安装SeaweedFS

    1.从GitHub下载编译好的SeaweedFS 地址:https://github.com/chrislusf/seaweedfs/releases 选择linux_amd64.tar.gz的压缩包 ...

  7. openstack核心组件——nova计算服务（7）

    云计算openstack核心组件——nova计算服务(7)   一.nova介绍:       Nova 是 OpenStack 最核心的服务,负责维护和管理云环境的计算资源.OpenStack 作为 ...

  8. ams入门了解

    另一篇介绍文  https://www.cnblogs.com/clds/p/4985893.html 转载自https://www.cnblogs.com/onlysun/p/4533798.htm ...

  9. archaius(2) 配置源

    上一节讲到,archaius实现动态配置的核心就是定时去配置中心拉去配置内容,接下来几接就来看一下archaius内部具体是如何实现的. 首先我们来了解一下配置源,什么是配置源呢,archaius内部 ...

  10. 【大数据】深入源码解析Map Reduce的架构

    这几天学习了MapReduce,我参照资料,自己又画了两张MapReduce的架构图. 这里我根据架构图以及对应的源码,来解释一次分布式MapReduce的计算到底是怎么工作的. ​话不多说,开始! ...