当前位置： 首页 > news >正文

【爬虫】5.5 Selenium 爬取Ajax网页数据

news 2025/12/15 9:45:42

目录 

AJAX 简介

任务目标

创建Ajax网站

创建服务器程序

编写爬虫程序

AJAX 简介

        AJAX（Asynchronous JavaScript And XML，异步 JavaScript 及 XML）

  1. Asynchronous 一种创建交互式、快速动态网页应用的网页开发技术
  2. 通过在后台与服务器进行少量数据交换，无需重新加载整个网页的情况下，能够异步更新部分网页的技术。
  3. AJAX是一种新的技术组合，即基于因特网标准，组合以下技术：
  • XMLHttpRequest 对象（与服务器异步交互数据）
  • JavaScript/DOM（显示/取回信息）
  • CSS（设置数据的样式）
  • XML（常用作数据传输的格式）

任务目标

  1. 现在的网页中大量使用了Ajax技术，通过JavaScript在客户端向服务器发出请求，服务器返回数据给客户端，客户端再把数据展现出来，这样做可以减少网页的闪动， 让用户有更好的体验。
  2. 我们先设计一个这样的网页，然后使用 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&#xff08;Asynchronous JavaScript And XML&#xff0c;异步 JavaScript 及 XML&#xff09; Asynchronous 一种创建交互式、快速动态网页应用的网页开发技术通过在后台与服务器进行…...

编程日记 2023/9/3 13:52:01

thinkphp6 入门（3）--获取GET、POST请求的参数值

一、Request对象 thinkphp提供了Request对象&#xff0c;其可以 支持对全局输入变量的检测、获取和安全过滤 支持获取包括$_GET、$_POST、$_REQUEST、$_SERVER、$_SESSION、$_COOKIE、$_ENV等系统变量&#xff0c;以及文件上传信息 具体参考&#xff1a;https://www.kanclou…...

编程日记 2023/9/3 13:50:59

JSON简介

JSON&#xff08;JavaScript Object Notation&#xff09;是一种轻量级的数据交换格式。它使用简洁的文本表示来存储和传输结构化数据。JSON数据由键值对组成&#xff0c;用逗号分隔。键是字符串&#xff0c;值可以是字符串、数字、布尔值、数组、对象或者null 1、JSON的优点 …...

编程日记 2023/9/3 13:49:58

[Java]_[初级]_[以SAX流的方式高效读取XML大文件]

场景 XML文件作为默认utf8格式的文件&#xff0c;它的作用和JSON文件相当。比如可以做为简单的数据存储格式&#xff0c;配置文件&#xff0c;网站的sitemap.xml导航等。它比json强的一点是它还有样式描述文件dtd,可以实现让XML里的结构化数据显示表格样式。 <?xml versi…...

编程日记 2023/9/3 13:48:57

Visual Studio中平台和配置的概念

在 Visual Studio 中&#xff0c;“平台”&#xff08;Platform&#xff09;和 “配置”&#xff08;Configuration&#xff09;是用于管理项目构建和设置的两个关键概念。在 “解决方案配置管理器” 中设置和管理 平台&#xff08;Platform&#xff09;&#xff1a; 指项目构…...

编程日记 2023/9/3 13:47:56

【vue2第八章】工程化开发和使用脚手架和文件结构

vue工程化开发 & 使用脚手架VUE CLI&#xff1a; 1&#xff0c;核心包传统开发模式&#xff1a;基于js/html/css直接引入核心包开发vue。 2&#xff0c;工程化开发。基于构建工具如(webpack)的环境中开发vue。 vue cli是什么&#xff1a; vue cli是一个vue官方提供的一个…...

编程日记 2023/9/3 13:46:55

建造者模式简介

概念&#xff1a; 建造者模式&#xff08;Builder Pattern&#xff09;是一种创建型设计模式&#xff0c;用于将复杂对象的构建过程与其表示分离。它允许您逐步构造一个复杂对象&#xff0c;同时保持灵活性和可读性。 特点&#xff1a; 将对象的构建过程封装在指导者类中&am…...

编程日记 2023/9/3 13:45:54

虚拟世界指南：从零开始，一步步教你安装、配置和使用VMware，镜像ISO文件！

本章目录 CentOS简介镜像下载一、新建虚拟机&#xff08;自定义&#xff09;1、进入主页&#xff0c;在主页中点击“创建新的虚拟机”2、点击创建虚拟机创建自己的虚拟机。可以选择自定义3、在“硬件兼容性(H)中选择&#xff1a;Workststion 15.x” ->下一步4、选择“稍后安…...

编程日记 2023/9/3 13:44:53

服务器卡顿怎么查找原因？

虽然服务器出现卡顿的现象比较少见&#xff0c;但也不排除出现的可能&#xff0c;而服务器一旦出现卡顿&#xff0c;造成的后果会严重的多。这里分享点笔记&#xff0c;希望有所帮助 1. 性能评估: 首先&#xff0c;对服务器的性能进行全面评估。检查 CPU 使用率、内存占用、磁…...

编程日记 2023/9/3 13:43:52

Pnpm,npm,yarn

npm 最初的npm只是简单的通过依赖去递归安装包&#xff0c;所以说每个依赖都会有自己的node_modules,node_modules是嵌套的。一个项目会存在多个包&#xff0c;多个包之间难免会有公共的依赖&#xff0c;node_modules嵌套的话&#xff0c;这样公共依赖就会下载多次。会造成磁盘…...

编程日记 2023/9/3 13:42:50

Kubernetes技术--使用kubeadm快速部署一个K8s集群

这里我们配置一个单master集群。(一个Master节点，多个Node节点) 1.硬件环境准备 一台或多台机器，操作系统 CentOS7.x-86_x64。这里我们使用安装了CentOS7的三台虚拟机 硬件配置：2GB或更多RAM，2个CPU或更多CPU，硬盘30GB或更多 2.主机名称和IP地址规划 3. 初始化准备工作…...

编程日记 2023/9/3 13:41:49

LeetCode 45题：跳跃游戏

题目 给定一个长度为 n 的 0 索引整数数组 nums。初始位置为 nums[0]。 每个元素 nums[i] 表示从索引 i 向前跳转的最大长度。换句话说&#xff0c;如果你在 nums[i] 处&#xff0c;你可以跳转到任意 nums[i j] 处: 0 < j < nums[i] i j < n 返回到达 nums[n - …...

编程日记 2023/9/3 13:40:48

idea中设置指定图片为项目站标

前提是准备好一张图片 在idea中创建imgs文件夹&#xff0c;放入图片 创建一个HTML文件 建立链接link标签&#xff0c;链接照片即可 <link href"../02css/imgs/2.jpg" rel"shortcut icon" type"image/x-icon"> 执行效果如下图所示&…...

编程日记 2023/9/3 13:39:45

【【萌新的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.…...

编程日记 2023/9/3 13:38:44

elementplus实现左侧菜单栏收缩与展开

1.页面结构 Home.vue下包含aside.vue和menu.vue 2.TAside.vue el-menu左侧菜单栏显示 注意&#xff1a; 要使用收缩与展开&#xff0c;el-aside必须设置width"collapse"&#xff0c;否则收缩展开会出现收缩后&#xff0c;el-aside宽度不变窄需要使用动态改变展开收…...

编程日记 2023/9/3 13:37:43

VBA技术资料MF50：VBA_在Excel中突出显示前3个值

【分享成果&#xff0c;随喜正能量】人受到尊重&#xff0c;不是因为权钱&#xff0c;而是他骨子里透出的&#xff0c;正直与善良。。 我给VBA的定义&#xff1a;VBA是个人小型自动化处理的有效工具。利用好了&#xff0c;可以大大提高自己的工作效率&#xff0c;而且可以提高…...

编程日记 2023/9/3 13:36:41

linux定时删除服务器日志

不说废话。直接进入操作流程 linux 定时任务是用的crontab 查看 crontab是否启动 service crond statusdead 死的 启动crontab service crond start 再次查看状态 running 运转的 查看 crontab cat /etc/crontab 查看 crontab任务 crontab -l 编辑 crontab任务 crontab …...

编程日记 2023/9/3 13:35:40

网络地址转换技术NAT(第九课)

一 什么是NAT？ NAT是网络地址转换的缩写，是一种在计算机网络中使用的技术，可以将私有地址转换为公共地址，从而实现本地网络与公共网络的互联。NAT工作在网络层，可以隐藏内部网络中的IP地址和端口号，从而增强网络的安全性和灵活性。在家庭网络、企业网络、公共WIFI热点等…...

编程日记 2023/9/3 13:34:39

K8s 在创建pod时api-server是先找scheduler 还是controller-manager

在K8s中&#xff0c;创建Pod时的流程如下&#xff1a; 用户通过Kubectl或其他方式向API Server发送创建Pod的请求。API Server接收到请求后&#xff0c;会先进行权限验证和身份认证。一旦验证通过&#xff0c;API Server会将请求转发给Scheduler组件。Scheduler负责对新创建的…...

编程日记 2023/9/3 13:33:38

【笔记】常用 js 函数

数组去重 Array.from(new Set()) 对象合并 Object.assign . 这里有个细节&#xff1a;当两个对象中含有key相同value不同时&#xff0c;会以 后面对象的key&#xff1a;value为准 保留小数点后几位 toFixed 注意&#xff1a; Number型&#xff0c;用该方法处理完&#xff0c;会…...

编程日记 2023/9/3 13:32:37

零门槛NAS搭建：WinNAS如何让普通电脑秒变私有云？

一、核心优势&#xff1a;专为Windows用户设计的极简NAS WinNAS由深圳耘想存储科技开发&#xff0c;是一款收费低廉但功能全面的Windows NAS工具&#xff0c;主打“无学习成本部署” 。与其他NAS软件相比&#xff0c;其优势在于&#xff1a; 无需硬件改造&#xff1a;将任意W…...

编程新知 2025/9/22 15:46:39

论文解读：交大港大上海AI Lab开源论文 | 宇树机器人多姿态起立控制强化学习框架（二）

HoST框架核心实现方法详解 - 论文深度解读（第二部分） 《Learning Humanoid Standing-up Control across Diverse Postures》 系列文章： 论文深度解读 + 算法与代码分析（二） 作者机构： 上海AI Lab, 上海交通大学, 香港大学, 浙江大学, 香港中文大学 论文主题： 人形机器人…...

编程新知 2025/8/4 18:55:37

零基础设计模式——行为型模式 - 责任链模式

第四部分&#xff1a;行为型模式 - 责任链模式 (Chain of Responsibility Pattern) 欢迎来到行为型模式的学习&#xff01;行为型模式关注对象之间的职责分配、算法封装和对象间的交互。我们将学习的第一个行为型模式是责任链模式。 核心思想&#xff1a;使多个对象都有机会处…...

编程新知 2025/12/10 21:51:45

汇编常见指令

汇编常见指令 一、数据传送指令 指令功能示例说明MOV数据传送MOV EAX, 10将立即数 10 送入 EAXMOV [EBX], EAX将 EAX 值存入 EBX 指向的内存LEA加载有效地址LEA EAX, [EBX4]将 EBX4 的地址存入 EAX&#xff08;不访问内存&#xff09;XCHG交换数据XCHG EAX, EBX交换 EAX 和 EB…...

编程新知 2025/11/4 20:56:54

C#中的CLR属性、依赖属性与附加属性

CLR属性的主要特征 封装性&#xff1a; 隐藏字段的实现细节 提供对字段的受控访问 访问控制&#xff1a; 可单独设置get/set访问器的可见性 可创建只读或只写属性 计算属性&#xff1a; 可以在getter中执行计算逻辑 不需要直接对应一个字段 验证逻辑&#xff1a; 可以…...

编程新知 2025/12/4 0:13:33

NPOI Excel用OLE对象的形式插入文件附件以及插入图片

static void Main(string[] args) {XlsWithObjData();Console.WriteLine("输出完成"); }static void XlsWithObjData() {// 创建工作簿和单元格,只有HSSFWorkbook,XSSFWorkbook不可以HSSFWorkbook workbook new HSSFWorkbook();HSSFSheet sheet (HSSFSheet)workboo…...

编程新知 2025/10/6 2:06:51

[ACTF2020 新生赛]Include 1(php://filter伪协议)

题目 做法 启动靶机&#xff0c;点进去 点进去 查看URL&#xff0c;有 ?fileflag.php说明存在文件包含&#xff0c;原理是php://filter 协议 当它与包含函数结合时&#xff0c;php://filter流会被当作php文件执行。 用php://filter加编码&#xff0c;能让PHP把文件内容…...

编程新知 2025/12/14 1:44:27

在鸿蒙HarmonyOS 5中使用DevEco Studio实现企业微信功能

1. 开发环境准备 ​​安装DevEco Studio 3.1​​&#xff1a; 从华为开发者官网下载最新版DevEco Studio安装HarmonyOS 5.0 SDK ​​项目配置​​&#xff1a; // module.json5 {"module": {"requestPermissions": [{"name": "ohos.permis…...

编程新知 2025/12/13 6:14:10

用鸿蒙HarmonyOS5实现中国象棋小游戏的过程

下面是一个基于鸿蒙OS (HarmonyOS) 的中国象棋小游戏的实现代码。这个实现使用Java语言和鸿蒙的Ability框架。 1. 项目结构 /src/main/java/com/example/chinesechess/├── MainAbilitySlice.java // 主界面逻辑├── ChessView.java // 游戏视图和逻辑├──…...

编程新知 2025/8/18 11:32:48

[USACO23FEB] Bakery S

题目描述 Bessie 开了一家面包店! 在她的面包店里&#xff0c;Bessie 有一个烤箱&#xff0c;可以在 t C t_C tC​ 的时间内生产一块饼干或在 t M t_M tM​ 单位时间内生产一块松糕。 ( 1 ≤ t C , t M ≤ 10 9 ) (1 \le t_C,t_M \le 10^9) (1≤tC​,tM​≤109)。由于空间…...

编程新知 2025/7/7 14:36:50