jQuery從數據屬性獲取路徑

Question

我有一個小問題，我想從數據屬性中獲取「路徑」並添加到背景。

HTML

<div> 
    <div data-image="../images/header.jpg"></div> 
</div> 

jQuery的

$('[data-image]').css(
    { 
     background: "url("+$(this).data('image')+") no-repeat center", 
     backgroundSize: "cover", 
     height: ($(document).height()/ 3) 
    } 
); 

你有任何想法如何做到這一點？

Answer 1

只是緩存元素的一個變量，並使用它

var elm = $('[data-image]'); // cache it 
elm.css({ 
    background: "url("+ elm.data('image') +") no-repeat center", // use it 
    backgroundSize: "cover", 
    height: ($(document).height()/ 3) 
}); 

如果有更多的元素，你可以使用each

elm.each(function(){ 
    $(this).css({ 
     background: "url("+ $(this).data('image')+ ") no-repeat center", 
     backgroundSize: "cover", 
     height: ($(document).height()/ 3) 
    }); 
});