使用`href`屬性作爲CSS background-image

我有以下HTML，我不能修改。有一個CSS文件，我可以。有沒有辦法獲得href值/屬性並將其用作CSS background-image？使用`href`屬性作爲CSS background-image

我需要這樣的東西：

background-image: url(href value);

這可能嗎？ href值是搜索的結果，因此它不總是相同的。

<tr class="trdata1"> 
    <td class="file"> 
     <span class="nobr"> 
      <nobr> 
       <a href="/C/.../.../image.jpg"> 
        <img class="icon" src="/file.gif" alt="">$image.jpg 
       </a> 
      </nobr> 
     </span> 
    </td> 
</tr>

來源

2016-11-08 texasfox

您可以使用JavaScript或jQuery的做到這一點 –

@AbhishekPandey - 如何將有可能使用JavaScript沒有它的HTML腳本代碼內， JavaScript在現有的HTML頁面上的結果？ – texasfox

不，沒有辦法用純CSS來做，你必須使用Javascript。例如。與jQuery：

$('.your-element').css(
    'background-image', 'url(' + $('.trdata1 > .file a').attr('href') + ')' 
);

來源

2016-11-08 07:18:23 andreas

因爲我無法修改html，我該如何使用javascript/jQuery？ – texasfox

恐怕沒有辦法在不修改html的情況下實現您的目標... – andreas

你可以得到該超鏈接的屬性，並將其應用到jQuery的元素。

var imgHref = $(".nobr nobr a").attr("href"); 
$(".imageBg").css('background-image','url('+imgHref+')');

working example

注意：請確保類名稱是唯一的

來源

2016-11-08 07:33:38

我希望將某些內容應用到現有頁面而不修改html，因爲它不可能。唯一可以修改的是CSS文件。 – texasfox

沒有辦法用純CSS動態做到這一點。

在純CSS，你可以做到這一點只有靜態：

your-selector { 
    background-image: url("static-value"); 
}

來源

2016-11-08 08:00:29 simhumileco

使用`href`屬性作爲CSS background-image

回答

相關問題