目录:导读
前言
web自动化遇到shadowDOM你会操作吗?
之前在做web自动化的时候,发现页面上有些元素,在selenium中无法通过xpath来定位,各种原因找了半天都没找到解决方案,最后发现元素在一个叫做shadow-root的节点下面,如下所示:
问题:shadow-root是什么?为什么下面的节点在selenium无法通过xapth来定位?
shadowDOM介绍
可以看成一个隐藏的DOM。它是一个独立的DOM树,具有自己的元素和样式,与原始文档DOM完全隔离。
ShadowDOM 必须附在一个HTML元素中,存放shadowDOM的元素,我们可以把它称为宿主元素。
在HTML5中有很多的标签样式都是通过shadowDOM来实现的。
比如:日期选择框,音频播放标签,视频播放标签都自带了样式;
这边以音频播放标签audio为例:在html文件中写入一个audio标签,页面上显示出来的内容就会出现一个音频播放器,如下图:
<audio src="file/123.mp3