我在試著用硒測試一個圖像。但我的問題是，圖像是背景圖像，它沒有img標(biāo)簽，它有這樣的html代碼(這是https://openweather.co.uk/products網(wǎng)頁的橫幅):

<div class="current-img white-text half-section-right main-section-desktop"></div>

這個CSS樣式

有可能得到背景圖像的高度和寬度嗎？類似于arguments[0]的東西。寬度和參數(shù)[0]。身高？

當(dāng)我嘗試這段代碼時:

document.getElementsByClassName('current-img')[0].style.backgroundImage;

我得到了[] -空(像我的人生)的結(jié)果。盡管CSS樣式存在(見所附圖片)。 相同的結(jié)果:

document.getElementsByClassName('current-img white-text half-section-right main-section-desktop')[0].style.backgroundSize

當(dāng)我嘗試:

document.getElementsByClassName('current-img white-text half-section-right main-section-desktop')[0].style

我得到了CSSStyleDeclaration { accentColor:' '，additiveSymbols:' '，alignContent:' '，alignItems:' '，alignSelf:' '，…}的所有空屬性。

為什么我得到空的結(jié)果？

您可以使用window . getcomputedstyle(your element)來獲取DOM元素的計算CSS樣式。

在MDN文檔中有更多關(guān)于這個的信息。

這里有一個例子:

const element = document.getElementsByClassName('current-img white-text half-section-right main-section-desktop')[0];
const style = window.getComputedStyle(element);
// style.height is a string like this: '12px'
const height = parseInt(style.height, 10);

這樣，您可以獲得backgroundSize屬性，但是如果他們沒有顯式設(shè)置它，并且它是默認(rèn)的“auto”值，您可以執(zhí)行以下操作:

獲取用作背景的圖像文件，并使用下面的代碼確定該圖像的大小(因為auto將使用它)。這有點棘手，因為您必須等待圖像加載。

// Get the element
const element = document.querySelector('.current-img.white-text.half-section-right.main-section-desktop')

// Get the computed style of the element
const style = window.getComputedStyle(element);

// Get the background image property
const backgroundImage = style.getPropertyValue('background-image');

// Extract the URL from the background image property
const imageUrl = backgroundImage.match(/url\(["']?([^"']*)["']?\)/)[1];

// Create an image object to load the background image
const image = new Image();
image.src = imageUrl;

// Get the image's natural width and height
image.onload = function() {
  const imageWidth = this.width;
  const imageHeight = this.height;
  
  // Use the imageWidth and imageHeight as needed
  console.log('Width:', imageWidth, 'Height:', imageHeight);
};