如何在使用Selenium和Python选择父级div后访问网页中的内部div?

huangapple go评论66阅读模式
英文:

how can I access to insted div in a webpage after I selected parent div with selenium python

问题

I hope you are all doing fine. I am totally new to Selenium and I am trying to save all images, as well as the text description of each image, on each page of the Realself website. This is what I found in the inspect mode of the website:

<div class="fixed-img2">
  <div content="//fi.realself.com/340/2b7d179ededf559f87b06202a9187ee1/0/8/4/Injectable-Fillers-after-3292504-2757399.JPG" alt="Facial Rejuvenation with Injectable Fillers Facial rejuvenation was softly done over a course of 2 years to achieve a very natural and balanced" index="2" hide-icon="true" set-of-images="["//fi.realself.com/340/ff348ae5be9e09ede726574260fa386e/5/6/2/Injectable-Fillers-before-3292504-2757398.JPG"]" regwall-override="true">
    <div class="Overlay--responsive">
      <div class="Overlay Overlay--explicitVideo Overlay--explicitBlock u-backgroundTransparent ng-hide" data-gtm="{"event":"safe-mode-block-click","safeMode":false}" ng-click="toggle()" ng-show="vm.blocked" role="button" tabindex="0" aria-hidden="true">
        <div ng-show="!vm.hideIcon" class="Overlay-explicitIcon ng-hide" style="" aria-hidden="true">
          <svg icon-id="nsfw-icon" class="Icon Icon--size56x56"><!-- --><use ng-if="$ctrl.iconURL" xlink:href="#rs-svg-nsfw-icon"></use><!-- --></svg>
        </div>
        <div class="Overlay-explicitTextBlock ng-hide" ng-show="vm.textmode" aria-hidden="true">
          <span class="Overlay-text Overlay-explicitTextBlack"> Sensitive content </span>
          <span class="Overlay-text Overlay-explicitTextBlack"> Click for real patient photos </span>
        </div>
      </div>

      <img src="//fi.realself.com/340/2b7d179ededf559f87b06202a9187ee1/0/8/4/Injectable-Fillers-after-3292504-2757399.JPG" class="lazyloaded" data-src="//fi.realself.com/340/2b7d179ededf559f87b06202a9187ee1/0/8/4/Injectable-Fillers-after-3292504-2757399.JPG">
    </div>
  </div>
</div>

I used the command below to select all elements with the class "fixed-img2":

images = driver.find_elements(By.CLASS_NAME, "fixed-img2")

After selecting all image elements, I need to loop over them. Inside the child div, I need to save the image with the content attribute. Based on the index attribute value, I need to separate them into before and after images, and at the end, save the image description with the alt attribute.

This is the Realself website page:
Realself Website Page

Is this overall a good way to save the images on each page?

英文:

I hope you are all doing fine. I am totally new to Selenium and I am trying to save all images, as well as the text description of each image, on each page of the Realself website. This is what I found in the inspect mode of the website:

&lt;div class=&quot;fixed-img2&quot;&gt;
&lt;div content=&quot;//fi.realself.com/340/2b7d179ededf559f87b06202a9187ee1/0/8/4/Injectable-Fillers-after-3292504-2757399.JPG&quot; alt=&quot;Facial Rejuvenation with Injectable Fillers Facial rejuvenation was softly done over a course of 2 years to achieve a very natural and balanced&quot; index=&quot;2&quot; hide-icon=&quot;true&quot; set-of-images=&quot;[&amp;quot;\/\/fi.realself.com\/340\/ff348ae5be9e09ede726574260fa386e\/5\/6\/2\/Injectable-Fillers-before-3292504-2757398.JPG&amp;quot;]&quot; regwall-override=&quot;true&quot;&gt;
&lt;div class=&quot;Overlay--responsive&quot;&gt;
&lt;div class=&quot;Overlay Overlay--explicitVideo Overlay--explicitBlock u-backgroundTransparent ng-hide&quot; data-gtm=&quot;{&amp;quot;event&amp;quot;:&amp;quot;safe-mode-block-click&amp;quot;,&amp;quot;safeMode&amp;quot;:false}&quot; ng-click=&quot;toggle()&quot; ng-show=&quot;vm.blocked&quot; role=&quot;button&quot; tabindex=&quot;0&quot; aria-hidden=&quot;true&quot;&gt;
&lt;div ng-show=&quot;!vm.hideIcon&quot; class=&quot;Overlay-explicitIcon ng-hide&quot; style=&quot;&quot; aria-hidden=&quot;true&quot;&gt;
&lt;svg icon-id=&quot;nsfw-icon&quot; class=&quot;Icon Icon--size56x56&quot;&gt;&lt;!----&gt;&lt;use ng-if=&quot;$ctrl.iconURL&quot; xlink:href=&quot;#rs-svg-nsfw-icon&quot;&gt;&lt;/use&gt;&lt;!----&gt;&lt;/svg&gt;
&lt;/div&gt;
&lt;div class=&quot;Overlay-explicitTextBlock ng-hide&quot; ng-show=&quot;vm.textmode&quot; aria-hidden=&quot;true&quot;&gt;
&lt;span class=&quot;Overlay-text Overlay-explicitTextBlack&quot;&gt; Sensitive content &lt;/span&gt;
&lt;span class=&quot;Overlay-text Overlay-explicitTextBlack&quot;&gt; Click for real patient photos &lt;/span&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;img src=&quot;//fi.realself.com/340/2b7d179ededf559f87b06202a9187ee1/0/8/4/Injectable-Fillers-after-3292504-2757399.JPG&quot; class=&quot; lazyloaded&quot; data-src=&quot;//fi.realself.com/340/2b7d179ededf559f87b06202a9187ee1/0/8/4/Injectable-Fillers-after-3292504-2757399.JPG&quot;&gt;
&lt;/div&gt;
&lt;/div&gt;

I used the command blow to select all element of "fixed-img2"

images = driver.find_elements(By.CLASS_NAME, &quot;fixed-img2&quot;)

After selecting all image elements, I need to loop over them. Inside the child div, I need to save the image with the content attribute. Based on the index attribute value, I need to separate them into before and after images, and at the end, save the image description with the alt attribute.

this is the realself website page:
<https://www.realself.com/photos/dermal-fillers#page=3&tags=&location=2038>

is this overally a good way to save the images on each page?

答案1

得分: 1

如果似乎ALT属性在后图像中没有更改。因此,您可以添加一些字符串以与ALT值一起使用。

以下是获取项目列表的代码。现在您可以使用您的代码保存这些值。

之前:

listImageCONTENTBefore = [item.get_attribute("content") for item in driver.find_elements(By.CSS_SELECTOR, "div.fixed-img2 > div[content*='before']")
listImageALTBefore = [item.get_attribute("alt") + "_before" for item in driver find_elements(By.CSS_SELECTOR, "div.fixed-img2 > div[content*='before']"]

之后:

listImageCONTENTAfter = [item.get_attribute("content") for item in driver.find_elements(By.CSS_SELECTOR, "div.fixed-img2 > div[content*='after']"]
listImageALTAfter = [item.get_attribute("alt") + "_after" for item in driver.find_elements(By.CSS_SELECTOR, "div.fixed-img2 > div[content*='after']"]
英文:

If seems ALT attribute don't change in the after image. SO you can add some string to with ALT value.

Here is the code to get the list of items. Now you can use your code to Save those value.

Before:

listImageCONTENTBefore =[item.get_attribute(&quot;content&quot;) for item in driver.find_elements(By.CSS_SELECTOR, &quot;div.fixed-img2 &gt;div[content*=&#39;before&#39;]&quot;)
listImageALTBefore =[item.get_attribute(&quot;alt&quot;) + &quot;_before&quot; for item in driver.find_elements(By.CSS_SELECTOR, &quot;div.fixed-img2 &gt;div[content*=&#39;before&#39;]&quot;)

After:

listImageCONTENTAfter =[item.get_attribute(&quot;content&quot;) for item in driver.find_elements(By.CSS_SELECTOR,&quot;div.fixed-img2 &gt;div[content*=&#39;after&#39;]&quot;)
listImageALTAfter =[item.get_attribute(&quot;alt&quot;) + &quot;_after&quot; for item in driver.find_elements(By.CSS_SELECTOR,&quot;div.fixed-img2 &gt;div[content*=&#39;after&#39;]&quot;)

huangapple
  • 本文由 发表于 2023年3月8日 17:36:11
  • 转载请务必保留本文链接:https://go.coder-hub.com/75671389.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定