【爬虫】5.5 Selenium 爬取Ajax网页数据
目录
AJAX 简介
任务目标
创建Ajax网站
创建服务器程序
编写爬虫程序
AJAX 简介
AJAX(Asynchronous JavaScript And XML,异步 JavaScript 及 XML)
- Asynchronous 一种创建交互式、快速动态网页应用的网页开发技术
- 通过在后台与服务器进行少量数据交换,无需重新加载整个网页的情况下,能够异步更新部分网页的技术。
- AJAX是一种新的技术组合,即基于因特网标准,组合以下技术:
- XMLHttpRequest 对象(与服务器异步交互数据)
- JavaScript/DOM(显示/取回信息)
- CSS(设置数据的样式)
- XML(常用作数据传输的格式)

任务目标
- 现在的网页中大量使用了Ajax技术,通过JavaScript在客户端向服务器发出请求,服务器返回数据给客户端,客户端再把数据展现出来,这样做可以减少网页的闪动, 让用户有更好的体验。
- 我们先设计一个这样的网页,然后使用 Selenium 编写爬虫程序爬取网页的数据。
创建Ajax网站
phone.html 如下:
注:phone.html 文件要位于 templates 这个目录下
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body onload="init()">
<div>选择品牌<select id="marks" onchange="display()"></select></div>
<div id="phones"></div>
</body>
<script>function init() {var marks = new Array("华为", "苹果", "三星");var selm = document.getElementById("marks");for (var i = 0; i < marks.length; i++) {selm.options.add(new Option(marks[i], marks[i]));}selm.selectedIndex = 0;display();}function display() {try {var http = new XMLHttpRequest();var selm = document.getElementById("marks");var m = selm.options[selm.selectedIndex].text;http.open("get", "/phones?mark=" + m, false);http.send(null);msg = http.responseText; //传递参数,一般post方法使用,get不传参数obj = eval("(" + msg + ")"); //eval(”(执行的内容)”);加上圆括号的目的是迫使eval函数在运行JavaScript代码的时候强制将括号内的表达式转化为JavaScript对象。// JS中将JSON的字符串解析成JSON数据格式s = "<table width='200' border='1'><tr><td>型号</td><td>价格</td></tr>"for (var i = 0; i < obj.phones.length; i++) {s = s + "<tr><td>" + obj.phones[i].model + "</td><td>" + obj.phones[i].price + "</td></tr>";}s = s + "</table>";document.getElementById("phones").innerHTML = s;} catch (e) {alert(e);}}
</script>
</html>
创建服务器程序
服务器server.py程序如下:
import flask
import jsonapp = flask.Flask(__name__)@app.route("/")
def index():return flask.render_template("phone.html")@app.route("/phones")
def getPhones():mark = flask.request.values.get("mark")phones = []if mark == "华为":phones.append({"model": "P9", "mark": "华为", "price": 3800})phones.append({"model": "P10", "mark": "华为", "price": 4000})elif mark == "苹果":phones.append({"model": "iPhone5", "mark": "苹果", "price": 5800})phones.append({"model": "iPhone6", "mark": "苹果", "price": 6800})elif mark == "三星":phones.append({"model": "Galaxy A9", "price": 2800})s = json.dumps({"phones": phones}) # python对象转化为json字符串return sapp.run()
网站结果如下:

编写爬虫程序
(1) 创建一个浏览器对象driver,使用这个driver对象模拟浏览器。
(2) 访问http://127.0.0.1:5000网站,爬取第一个页面的手机数据。
(3) 从第一个页面中获取<select>中所有的选择项目options。
(4) 循环options中的每个option,并模拟这个option的click点击动作,触发 onchange
爬虫程序 WebScraper.py 如下:
from selenium import webdriver
from selenium.webdriver.chrome.options import Options
from selenium.webdriver.common.by import By
import timedef spider(index):trs = driver.find_elements(By.TAG_NAME, "tr")for i in range(1, len(trs)): # 从第二行开始查找和提取# print(i)tds = trs[i].find_elements(By.TAG_NAME, "td")model = tds[0].textprice = tds[1].textprint("%-16s%-16s" % (model, price))select = driver.find_element(By.ID, "marks")options = select.find_elements(By.TAG_NAME, "option")if index < len(options) - 1:index += 1options[index].click()time.sleep(3)spider(index)chrome_options = Options()
chrome_options.add_argument('--headless')
driver = webdriver.Chrome()
driver.get("http://127.0.0.1:5000")spider(0) # 从option=0开始driver.close()
运行结果:

下一篇文章:5.6 Selenium等待HTML元素
相关文章:
【爬虫】5.5 Selenium 爬取Ajax网页数据
目录 AJAX 简介 任务目标 创建Ajax网站 创建服务器程序 编写爬虫程序 AJAX 简介 AJAX(Asynchronous JavaScript And XML,异步 JavaScript 及 XML) Asynchronous 一种创建交互式、快速动态网页应用的网页开发技术通过在后台与服务器进行…...
thinkphp6 入门(3)--获取GET、POST请求的参数值
一、Request对象 thinkphp提供了Request对象,其可以 支持对全局输入变量的检测、获取和安全过滤 支持获取包括$_GET、$_POST、$_REQUEST、$_SERVER、$_SESSION、$_COOKIE、$_ENV等系统变量,以及文件上传信息 具体参考:https://www.kanclou…...
JSON简介
JSON(JavaScript Object Notation)是一种轻量级的数据交换格式。它使用简洁的文本表示来存储和传输结构化数据。JSON数据由键值对组成,用逗号分隔。键是字符串,值可以是字符串、数字、布尔值、数组、对象或者null 1、JSON的优点 …...
[Java]_[初级]_[以SAX流的方式高效读取XML大文件]
场景 XML文件作为默认utf8格式的文件,它的作用和JSON文件相当。比如可以做为简单的数据存储格式,配置文件,网站的sitemap.xml导航等。它比json强的一点是它还有样式描述文件dtd,可以实现让XML里的结构化数据显示表格样式。 <?xml versi…...
Visual Studio中平台和配置的概念
在 Visual Studio 中,“平台”(Platform)和 “配置”(Configuration)是用于管理项目构建和设置的两个关键概念。在 “解决方案配置管理器” 中设置和管理 平台(Platform): 指项目构…...
【vue2第八章】工程化开发和使用脚手架和文件结构
vue工程化开发 & 使用脚手架VUE CLI: 1,核心包传统开发模式:基于js/html/css直接引入核心包开发vue。 2,工程化开发。基于构建工具如(webpack)的环境中开发vue。 vue cli是什么: vue cli是一个vue官方提供的一个…...
建造者模式简介
概念: 建造者模式(Builder Pattern)是一种创建型设计模式,用于将复杂对象的构建过程与其表示分离。它允许您逐步构造一个复杂对象,同时保持灵活性和可读性。 特点: 将对象的构建过程封装在指导者类中&am…...
虚拟世界指南:从零开始,一步步教你安装、配置和使用VMware,镜像ISO文件!
本章目录 CentOS简介镜像下载一、新建虚拟机(自定义)1、进入主页,在主页中点击“创建新的虚拟机”2、点击创建虚拟机创建自己的虚拟机。可以选择自定义3、在“硬件兼容性(H)中选择:Workststion 15.x” ->下一步4、选择“稍后安…...
服务器卡顿怎么查找原因?
虽然服务器出现卡顿的现象比较少见,但也不排除出现的可能,而服务器一旦出现卡顿,造成的后果会严重的多。这里分享点笔记,希望有所帮助 1. 性能评估: 首先,对服务器的性能进行全面评估。检查 CPU 使用率、内存占用、磁…...
Pnpm,npm,yarn
npm 最初的npm只是简单的通过依赖去递归安装包,所以说每个依赖都会有自己的node_modules,node_modules是嵌套的。一个项目会存在多个包,多个包之间难免会有公共的依赖,node_modules嵌套的话,这样公共依赖就会下载多次。会造成磁盘…...
Kubernetes技术--使用kubeadm快速部署一个K8s集群
这里我们配置一个单master集群。(一个Master节点,多个Node节点) 1.硬件环境准备 一台或多台机器,操作系统 CentOS7.x-86_x64。这里我们使用安装了CentOS7的三台虚拟机 硬件配置:2GB或更多RAM,2个CPU或更多CPU,硬盘30GB或更多 2.主机名称和IP地址规划 3. 初始化准备工作…...
LeetCode 45题:跳跃游戏
题目 给定一个长度为 n 的 0 索引整数数组 nums。初始位置为 nums[0]。 每个元素 nums[i] 表示从索引 i 向前跳转的最大长度。换句话说,如果你在 nums[i] 处,你可以跳转到任意 nums[i j] 处: 0 < j < nums[i] i j < n 返回到达 nums[n - …...
idea中设置指定图片为项目站标
前提是准备好一张图片 在idea中创建imgs文件夹,放入图片 创建一个HTML文件 建立链接link标签,链接照片即可 <link href"../02css/imgs/2.jpg" rel"shortcut icon" type"image/x-icon"> 执行效果如下图所示&…...
【【萌新的STM32学习-27--USART异步通信配置步骤】】
萌新的STM32学习-27–USART异步通信配置步骤 USART/UART 异步通信配置步骤 1.配置串口工作参数 HAL_UART_Init() 我们会在此处调用MSP中的回调函数 2.串口底层初始化 用户定义HAL_UART_MspInit() 配置GPIO NVIC CLOCK 等 3.开启串口异步接收中断 HAL_UART_Receive_IT() 4.…...
elementplus实现左侧菜单栏收缩与展开
1.页面结构 Home.vue下包含aside.vue和menu.vue 2.TAside.vue el-menu左侧菜单栏显示 注意: 要使用收缩与展开,el-aside必须设置width"collapse",否则收缩展开会出现收缩后,el-aside宽度不变窄需要使用动态改变展开收…...
VBA技术资料MF50:VBA_在Excel中突出显示前3个值
【分享成果,随喜正能量】人受到尊重,不是因为权钱,而是他骨子里透出的,正直与善良。。 我给VBA的定义:VBA是个人小型自动化处理的有效工具。利用好了,可以大大提高自己的工作效率,而且可以提高…...
linux定时删除服务器日志
不说废话。直接进入操作流程 linux 定时任务是用的crontab 查看 crontab是否启动 service crond statusdead 死的 启动crontab service crond start 再次查看状态 running 运转的 查看 crontab cat /etc/crontab 查看 crontab任务 crontab -l 编辑 crontab任务 crontab …...
网络地址转换技术NAT(第九课)
一 什么是NAT? NAT是网络地址转换的缩写,是一种在计算机网络中使用的技术,可以将私有地址转换为公共地址,从而实现本地网络与公共网络的互联。NAT工作在网络层,可以隐藏内部网络中的IP地址和端口号,从而增强网络的安全性和灵活性。在家庭网络、企业网络、公共WIFI热点等…...
K8s 在创建pod时api-server是先找scheduler 还是controller-manager
在K8s中,创建Pod时的流程如下: 用户通过Kubectl或其他方式向API Server发送创建Pod的请求。API Server接收到请求后,会先进行权限验证和身份认证。一旦验证通过,API Server会将请求转发给Scheduler组件。Scheduler负责对新创建的…...
【笔记】常用 js 函数
数组去重 Array.from(new Set()) 对象合并 Object.assign . 这里有个细节:当两个对象中含有key相同value不同时,会以 后面对象的key:value为准 保留小数点后几位 toFixed 注意: Number型,用该方法处理完,会…...
鸿蒙PC:鸿蒙electron跨端框架PC链接雷达实战:把本地收藏夹升级成可巡检的链接管理面板
前言 欢迎加入鸿蒙PC开发者社区,共同打造开发者工具生态:鸿蒙PC开发者社区 :https://harmonypc.csdn.net/ 项目开源地址:https://AtomGit.com/lqjmac/ele_lianjieleida 浏览器收藏夹能保存链接,但不擅长保存判断。 …...
品牌在AI搜索时代不被推荐,问题可能出在这三个地方
一个正在发生的真相越来越多的用户不再打开百度输入关键词,而是直接问DeepSeek、豆包、文心一言。对品牌而言,这意味着一件事实:用户获得答案的方式变了,但你的品牌曝光策略可能还停在原地。一个值得重视的数据是:目前…...
权威深度指南:使用iperf3 Windows版进行网络性能评估与优化实战
权威深度指南:使用iperf3 Windows版进行网络性能评估与优化实战 【免费下载链接】iperf3-win-builds iperf3 binaries for Windows. Benchmark your network limits. 项目地址: https://gitcode.com/gh_mirrors/ip/iperf3-win-builds iperf3 Windows版是专业…...
2026跨境实测|主流国产AI视频生成工具图生视频功能深度测评
在TikTok、Shopee、亚马逊短视频带货常态化的2026年,跨境商家的核心痛点早已不是不会拍视频,而是量产难、成本高、画面违和、适配海外场景差。传统真人拍摄、外包剪辑模式,不仅耗时耗力,还难以跟上跨境平台的流量更新节奏。而AI视…...
Android 指纹浏览器开发教程三:WebView、Chromium 和壳层方案怎么选
导语 Android 指纹浏览器项目走到第三步,往往要面对第一个“分叉路口”:到底用系统 WebView、自编译 Chromium,还是在现有内核外面再套一层壳? 以 EasyBR 指纹浏览器为例,更关键的不是单点参数,而是整条配置…...
嘎嘎降AI和率零深度对比:2026年同为低价工具效果差距完整评测报告
嘎嘎降AI和率零深度对比:2026年同为低价工具效果差距完整评测报告 选工具之前做了一周功课,试用了三款,最后定了嘎嘎降AI(www.aigcleaner.com)。 4.8元,知网AI率从61%降到了5.3%,达标率99.26%…...
LimboAI在Godot 4中实现可维护游戏AI的工程化方案
1. 这不是又一个“AI行为树”教程——LimboAI在Godot 4里真正解决的是什么问题? 你有没有在Godot 4里写过这样的AI逻辑:一个巡逻的守卫,发现玩家后追击,进入攻击距离就挥剑,被击中后后退、喊话、短暂硬直,…...
如何快速配置大麦抢票自动化工具:5个步骤实现高效网络诊断与抓包分析
如何快速配置大麦抢票自动化工具:5个步骤实现高效网络诊断与抓包分析 【免费下载链接】ticket-purchase 大麦自动抢票,支持人员、城市、日期场次、价格选择 项目地址: https://gitcode.com/GitHub_Trending/ti/ticket-purchase 你是否曾因大麦网抢…...
3步解锁GTA V无限可能:ScriptHookV脚本注入核心技术深度解析
3步解锁GTA V无限可能:ScriptHookV脚本注入核心技术深度解析 【免费下载链接】ScriptHookV An open source hook into GTAV for loading offline mods 项目地址: https://gitcode.com/gh_mirrors/sc/ScriptHookV 想象一下,你正在玩《侠盗猎车手V》…...
AI科技日报-2026年5月22日
AI科技日报 日期:2026年5月22日人工智能正在从“会生成”向“会规划、会行动”进化,2026年成为全球AI发展的关键之年。以下为今日重要资讯。 一、大模型竞赛持续升级 OpenAI、谷歌、深度求索等顶尖AI企业正在发布规模更大或效率更高的最新版本大模型。斯…...
