使用python实现对元素的长截图功能

一.目标

浏览网页的时候,看见哪个元素,就能截取哪个元素当图片,不管那个元素有多长

二.所用工具和第三方库

python ,PIL,selenium

pycharm

三.代码部分

长截图整体思路:

1.获取元素

2.移动,截图,移动,截图,直到抵达元素的底部

3.把截图按照元素所在位置切割,在所有图片中只保留该元素

4.拼接

如果driver在环境变量中,那么不用指定路径

b=webdriver.Chrome(executable_path=r"C:\Users\Desktop\chromedriver.exe")#指定一下driver
b.get("https://www.w3school.com.cn/html/html_links.asp")
b.maximize_window()#最大化窗口

打开网站

我们可以看见一个ID为maincontent的元素,宽度为850PX,长度为3828PX,这个长度必须使用才能长截图才能完整截下来

el=b.find_element_by_id("maincontent")#找到元素

我们还需要一个重要的参数,就是你电脑一次能截取多高的像素

先用下图代码获取一个图片

#fp为存放图片的地址
b.get_screenshot_as_file(fp)

也就是说用我电脑上截图的默认高度为614像素

所以我设置一个变量:

sc_hight=614

然后设置一下其他变量

 count = int(el.size["height"] / sc_hight) # 元素的高度除以你每次截多少就是次数
  start_higth = el.location["y"] # 元素的初始高度
  max_px = start_higth + (count - 1) * sc_hight # for循环中最大的px
  last_px = el.size["height"] + start_higth - sc_hight # 元素最底部的位置
  surplus_px = last_px - max_px # 剩余的边的高度
  img_path = [] # 用来存放图片地址

注释:

1.count为元素的高度/每次截取的高度,比如这次实例中元素高度为3828PX,我每次截614px,需要6.2次,int之后变成6,也就是截6次,还剩一点,那一点后面再说

2.start_higth为初始高度,这个没有什么可说的

3.max_px为循环结束后,到达的高度

4.last_px为元素最底部的高度

5.surplus_px就是移动6次后,还没有截取的高度

屏幕每次移动,移动sc_hight个像素,初始位置为(0,元素的Y值)

 for i in range(0, count):
    js = "scrollTo(0,%s)" % (start_higth + i * sc_hight) # 用于移动滑轮,每次移动614px,初始值是元素的初始高度
    b.execute_script(js) # 执行js
    time.sleep(0.5)
    fp = r"C:\Users\wdj\Desktop\%s.png" % i # 图片地址,运行的话,改一下
    b.get_screenshot_as_file(fp) # 屏幕截图,这里是截取是完整的网页图片,你可以打断点看一下图片
    img = Image.open(fp=fp)
    img2 = img.crop((el.location["x"], 0, el.size["width"] + el.location["x"], sc_hight)) # 剪切图片
    img2.save(fp) # 保存图片,覆盖完整的网页图片
    img_path.append(fp) # 添加图片路径
    time.sleep(0.5)
    print(js)
  else:
    js = "scrollTo(0,%s)" % last_px # 滚动到最后一个位置
    b.execute_script(js)
    fp = r"C:\Users\wdj\Desktop\last.png"
    b.get_screenshot_as_file(fp)
    img = Image.open(fp=fp)
    print((el.location["x"], sc_hight - surplus_px, el.size["width"] + el.location["x"], sc_hight))
    img2 = img.crop((el.location["x"], sc_hight - surplus_px, el.size["width"] + el.location["x"], sc_hight))
    img2.save(fp)
    img_path.append(fp)
    print(js)

上面是把该元素的在页面都截完,并且剪切,把图片保存的路径放入img_path

最后一步:把所有截图都贴到新创建的图片中

 new_img = Image.new("RGB", (el.size["width"], el.size["height"])) # 创建一个新图片,大小为元素的大小
  k = 0
  for i in img_path:
    tem_img = Image.open(i)
    new_img.paste(tem_img, (0, sc_hight * k)) # 把图片贴上去,间隔一个截图的距离
    k += 1
  else:
    new_img.save(r"C:\Users\wdj\Desktop\test.png") # 保存

运行效果图:

说明完整的截取下来了

补充优化:

如果是个小元素怎么办,不用长截图就能截取的那种

因为很简单我就直接贴代码了

 start_higth = el.location["y"]
  js = "scrollTo(0,%s)" % (start_higth)
  b.execute_script(js) # 执行js
  time.sleep(0.5)
  fp = r"C:\Users\wdj\Desktop\test.png" # 图片地址,运行的话,改一下
  b.get_screenshot_as_file(fp)
  img = Image.open(fp=fp)
  img2 = img.crop((el.location["x"], 0, el.size["width"] + el.location["x"], el.size["height"])) # 剪切图片
  img2.save(fp)

效果如下:

完整代码:

from selenium import webdriver
from PIL import Image
import time
def short_sc(el,b):
  start_higth = el.location["y"]
  js = "scrollTo(0,%s)" % (start_higth)
  b.execute_script(js) # 执行js
  time.sleep(0.5)
  fp = r"C:\Users\wdj\Desktop\test.png" # 图片地址,运行的话,改一下
  b.get_screenshot_as_file(fp)
  img = Image.open(fp=fp)
  img2 = img.crop((el.location["x"], 0, el.size["width"] + el.location["x"], el.size["height"])) # 剪切图片
  img2.save(fp)
def long_sc(el,b):
  count = int(el.size["height"] / sc_hight) # 元素的高度除以你每次截多少就是次数
  start_higth = el.location["y"] # 元素的初始高度
  max_px = start_higth + (count - 1) * sc_hight # for循环中最大的px
  last_px = el.size["height"] + start_higth - sc_hight # 元素最底部的位置
  surplus_px = last_px - max_px # 剩余的边的高度
  img_path = [] # 用来存放图片地址
  for i in range(0, count):
    js = "scrollTo(0,%s)" % (start_higth + i * sc_hight) # 用于移动滑轮,每次移动614px,初始值是元素的初始高度
    b.execute_script(js) # 执行js
    time.sleep(0.5)
    fp = r"C:\Users\wdj\Desktop\%s.png" % i # 图片地址,运行的话,改一下
    b.get_screenshot_as_file(fp) # 屏幕截图,这里是截取是完整的网页图片,你可以打断点看一下图片
    img = Image.open(fp=fp)
    img2 = img.crop((el.location["x"], 0, el.size["width"] + el.location["x"], sc_hight)) # 剪切图片
    img2.save(fp) # 保存图片,覆盖完整的网页图片
    img_path.append(fp) # 添加图片路径
    time.sleep(0.5)
    print(js)
  else:
    js = "scrollTo(0,%s)" % last_px # 滚动到最后一个位置
    b.execute_script(js)
    fp = r"C:\Users\wdj\Desktop\last.png"
    b.get_screenshot_as_file(fp)
    img = Image.open(fp=fp)
    print((el.location["x"], sc_hight - surplus_px, el.size["width"] + el.location["x"], sc_hight))
    img2 = img.crop((el.location["x"], sc_hight - surplus_px, el.size["width"] + el.location["x"], sc_hight))
    img2.save(fp)
    img_path.append(fp)
    print(js)
  new_img = Image.new("RGB", (el.size["width"], el.size["height"])) # 创建一个新图片,大小为元素的大小
  k = 0
  for i in img_path:
    tem_img = Image.open(i)
    new_img.paste(tem_img, (0, sc_hight * k)) # 把图片贴上去,间隔一个截图的距离
    k += 1
  else:
    new_img.save(r"C:\Users\wdj\Desktop\test.png") # 保存
b=webdriver.Chrome(executable_path=r"C:\Users\wdj\Desktop\chromedriver.exe")#指定一下driver
b.get("https://www.w3school.com.cn/html/html_links.asp")
b.maximize_window()#最大化窗口
# b.get_screenshot_as_file(fp)
sc_hight=614#你屏幕截图默认的大小,可以去截一张,去画图里面看看是多少像素,我这里是614像素
# b.switch_to.frame(b.find_element_by_xpath('//*[@id="intro"]/iframe'))
el=b.find_element_by_id("maincontent")#找到元素
if el.size["height"]>sc_hight:
  long_sc(el,b)
else:
  short_sc(el,b)

完整代码

PS:

有些特殊情况,比如截取的元素在iframe中,直接用driver.switch_to.frame(iframe元素)即可

或者不是iframe,但是元素有overflow属性,直接用JS把他的overflow去掉就行

(0)

相关推荐

  • python+selenium 定位到元素,无法点击的解决方法

    报错 selenium.common.exceptions.WebDriverException: Message: Element is not clickable at point (234.75, 22). Other element would receive the click: <img class="logo" src="/public/desktop/common/img/game_logo.png"> 需要点击的按钮页面显示不了,需要下

  • Python实现屏幕截图的两种方式

    使用windows API 使用PIL中的ImageGrab模块 下面对两者的特点和用法进行详细解释. 一.Python调用windows API实现屏幕截图 好处是 灵活 速度快 缺点是: 写法繁琐 不跨平台 import time import win32gui, win32ui, win32con, win32api def window_capture(filename): hwnd = 0 # 窗口的编号,0号表示当前活跃窗口 # 根据窗口句柄获取窗口的设备上下文DC(Divice C

  • Python 实现网页自动截图的示例讲解

    背景介绍 最近在为部门编写一个自动化测试工具,工具涉及到一个功能,即 将自动化测试生成的html报告截图,作为邮件正文,html文件上传到web服务器以链接形式添加到邮件中,最后发送邮件. 任务难点 之前从未接触过页面自动截图相关的方面,因此如何自动进行页面截图成为本地调研方向. 方案思考 在刚接到这个任务时,并不认同目前的方案.曾经一度认为,将html报告的内容写入邮件正文,即可通过html的形式发送邮件了.经过尝试后发现,邮件不支持带javascript的html.因此,选择了预览html并

  • python向字符串中添加元素的实例方法

    Python中的字符串对象是不能更改的,也即直接修改字符串中的某一位或几位字符是实现不了的,即python中字符串对象不可更改,但字符串对象的引用可更改,可重新指向新的字符串对象. + 直接字符串外+元素 name = 'zheng' print('my name is '+name) % 直接字符串外%(元素) 一种字符串格式化的语法, 基本用法是将值插入到%s占位符的字符串中. %s,表示格式化一个对象为字符 name = 'zhang' age = '25' print('my name

  • python调用系统ffmpeg实现视频截图、http发送

    python 调用系统ffmpeg进行视频截图,并进行图片http发送ffmpeg ,视频.图片的各种处理. 最近在做视频.图片的版权等深度学习识别,用到了ffmpeg部分功能,功能如下:  调用ffmpeg 对不同目录视频进行截图,通过http发送到后台进行算法识别.  每5分钟扫描最近的视频,生成图片,发送完毕图片删除. 代码如下: #!/usr/bin/env python # -*- coding: utf-8 -*- """'定时任务每五分钟发送上一个5分钟视频 目

  • python如何获取列表中每个元素的下标位置

    Git是编程中的基本技能之一,互联网公司几乎都在使用Git进行协作编程,昨天还有位禅友在微信上专门告诉我说星期五面试的时候刚好被问到 Git,幸好在这几天学了一下.Git并不难,但会Git至少可以说明一个人的学习能力或者说对技术的嗅觉能跟上主流,如果面试问你GitHub是什么都不知道,面试官就会对你打一个大的问号. 简单点评这一道题. 在使用 for 循环迭代一个列表时,有时我们需要获取列表中每个元素所在的下标位置是多少,例如 numbers = [10, 29, 30, 41],要求输出 (0

  • 用python一行代码得到数组中某个元素的个数方法

    想法由来 今天写代码过程中遇到一个需求,计算一个list中数值为1的元素的个数,其中这个list的元素数值不是为0就是为1. 一开始想到的是写个方法来计算: # 返回一个0,1数组中1的数量 def num_one(source_array): count = 0 for x in source_array: if x == 1: count += 1 return count 嗯好吧,然后觉得这是最low的方法了,就在想强大的python可不可以一行代码就做到以上的效果,然后发现真的可以. c

  • Python实现屏幕截图的代码及函数详解

    废话不多说,先给大家看下python实现屏幕截图的代码,具体代码如下所述: from selenium import webdriver import time def capture(url, save_fn="capture.png"): browser = webdriver.Firefox() # Get local session of firefox browser.set_window_size(1200, 900) browser.get(url) # Load pag

  • python删除列表元素的三种方法(remove,pop,del)

    remove 删除单个元素,删除首个符合条件的元素,按值删除,返回值为空 List_remove = [1, 2, 2, 2, 3, 4] print(List_remove.remove(2)) print("after remove", List_remove) # None # after remove [1, 2, 2, 3, 4] -------------------------------------------------------------------------

  • 使用python实现对元素的长截图功能

    一.目标 浏览网页的时候,看见哪个元素,就能截取哪个元素当图片,不管那个元素有多长 二.所用工具和第三方库 python ,PIL,selenium pycharm 三.代码部分 长截图整体思路: 1.获取元素 2.移动,截图,移动,截图,直到抵达元素的底部 3.把截图按照元素所在位置切割,在所有图片中只保留该元素 4.拼接 如果driver在环境变量中,那么不用指定路径 b=webdriver.Chrome(executable_path=r"C:\Users\Desktop\chromedr

  • Python实现简单查找最长子串功能示例

    本文实例讲述了Python实现简单查找最长子串功能.分享给大家供大家参考,具体如下: 题目选自edX公开课 MITx: 6.00.1x Introduction to Computer Science and Programming 课程 Week2 的Problem Set 1的第三题.下面是原题内容. Assume s is a string of lower case characters. Write a program that prints the longest substring

  • Python中Dataframe元素为不定长list时的拆分分组

    目录 引言 解决方法 总结 引言 本文想要解决的问题是当DataFrame中某一列元素为不定长度的数组时,该如何对它们进行拆分分解为后续元素,从而进行进一步的提取操作,数据格式见下图: 解决方法  这个问题的解决思路首先是要不定长的数组填充成等长的数组,从而后续可以直接转换为元素为单一值的标准DataFrame,再和原DataFrame合并即可完成操作.填充的部分使用了map()方法来实现,实现前还需要获得数组的最大长度以确定填充数目.代码见下: a=[[['a','d'],['b'],['a'

  • 关于Python 常用获取元素 Driver 总结

    1.在 Windows 设置临时环境变量 cmd命令窗口 输入 path=%path%;E:\soft\python-3.5.2-embed-win32 永久配置,在系统变量下找到path,在Path的最后面添加Python的安装目录 D:\Python34,同样在PATHEXT中添加 .PY;.PYM 然后,输入python 出现版本信息就成功了. 2.CMD命令窗口,清屏的方法 import os os.system('cls') 如果不要返回值0就是: import os i=os.sys

  • Python+Selenium+phantomjs实现网页模拟登录和截图功能(windows环境)

    本文全部操作均在windows环境下 安装 Python Python是一种跨平台的计算机程序设计语言,它可以运行在Windows.Mac和各种Linux/Unix系统上.是一种面向对象的动态类型语言,最初被设计用于编写自动化脚本(shell),随着版本的不断更新和语言新功能的添加,越来越多被用于独立的.大型项目的开发 去Python的官网  www.python.org  下载安装 安装时勾选pip (python包管理工具),同时安装pip python安装好之后,打开命令行工具cmd,输入

  • iOS使用WebView生成长截图的第3种解决方案

    前言 WebView就是一个内嵌浏览器控件,在iOS中主要有两种WebView:UIWebView和WKWebView,UIWebView是iOS2之后开始使用,WKWebView是在iOS8开始使用,WKWebView将逐步取代笨重的UIWebView. 由于项目需要,新近实现了一个长截图库 SnapshotKit.其中,需要支持 UIWebView.WKWebView 组件生成长截图.为了实现这个特性,查阅了很多资料,同时也做了不同的新奇思路尝试,最终实现了一个新的.取巧的技术方案. 以下主

  • 浅谈python输出列表元素的所有排列形式

    例如: ['a', 'b', 'c'] 输出 ['a', 'b', 'c'] ['a', 'c', 'b'] ['b', 'a', 'c'] ['b', 'c', 'a'] ['c', 'a', 'b'] ['c', 'b', 'a'] 方法一:利用递归的方式实现 def permutation(li): len_list = len(li) if len_list == 1: return li result = [] for i in range(len_list): res_list =

  • Python Selenium 设置元素等待的三种方式

    Selenium 设置元素等待的三种方式 1. sleep 强制等待     2. implicitly_wait() 隐性等待     3. WebDriverWait()显示等待 三种方式的优缺点 1. sleep 强制等待 from selenium import webdriver from time import sleep driver = webdriver.Chrome() sleep(2) #设置等待2秒钟 driver.get('http://www.baidu.com')

  • Python爬虫之Selenium实现窗口截图

    前言:由程序去执行的操作不允许有任何误差,有些时候在测试的时候未出现问题,但是放到服务器上就会报错,而且打印的错误信息并不十分明确.这时,我在想如果在脚本执行出错的时候能对当前窗口截图保存,那么通过图片就可以非常直观地看出出错的原因.WebDriver提供了截图函数get_screenshot_as_file()来截取当前窗口. 本章中用到的关键方法如下: get_screenshot_as_file():截图 from selenium import webdriver driver = we

  • python中slice参数过长的处理方法及实例

    很多小伙伴对于slice参数的概念理解停留在概念上,切片的参数有三个,分别是step .start .stop .因为参数的值也是多变的,所以我们需要对它们进行下一步的处理.在之前的slice讲解中我们提到列表数据过长的问题,其中在参数中也有这样的问题存在.下面我们就step .start .stop 三个参数的分别处理展开讲解,帮大家深入了解slice中的参数问题. 1.step 的处理 if (r->step == Py_None) { /* step 默认是 1,这不难理解 */ *ste

随机推荐