具有特定屬性的隱藏元素

我有一個腳本，其中列出幾千個圖像，每個圖像在一個單獨的div中。事情是這樣的：具有特定屬性的隱藏元素

<div class="imagecontainer"> 
    <img src="picturename.jpg"> 
</div> 

<div class="imagecontainer"> 
    <img src="picturename2.jpg"> 
</div>

我正在尋找做，是以某種方式與標籤和的filesizes尺寸的div，所以這將是容易的，我躲複製圖像的div，只需通過點擊它們。見下面什麼即時思考：

<script> 
function hide(filesize, imageheight, imagewidth) { 
    HERE I NEED CODE TO HIDE ALL DIVS THAT HAS THE SPECIFIED FILESIZE, 
    IMAGEHEIGHT AND IMAGEWIDTH. 
} 
</script> 

<div class="imagecontainer" filesize="279603" imageheight="500" imagewidth="380" 
onclick="hide('279603', '500', '380')"> 
    <img src="picturename.jpg"> 
</div> 

<div class="imagecontainer" filesize="272655" imageheight="500" imagewidth="380" 
onclick="hide('272655', '500', '380')"> 
    <img src="picturename2.jpg"> 
</div>

你能明白我想要做什麼？我不知道如何根據這些標準「標記」div來找到它們。也許還有其他方法可以做到這一點？

來源

2014-07-26 Kristian Rafteseth

爲什麼你甚至根據文件大小和尺寸來識別圖像，而不是文件名？如果兩幅圖像的大小完全相同（讓我們面對它，鑑於「數千幅圖像」被*束縛*發生）會怎麼樣？ – BoltClock

因爲圖像來自易趣類型的網站，所以文件名是隨機的，但可以包含相同的圖像。是的，我知道這種方法不是100％萬無一失的，但它足以滿足我將要使用它的目的。 –

這很簡單，如果你使用jQuery。它可以用直接的JavaScript來完成，但需要更多的努力。你的函數將是這樣的：

<script> 
function hide(filesize, imageheight, imagewidth) { 
    $('.imagecontainer[filesize="' + filesize + '"]' + '[imageheight="' + imageheight+ '"]' + '[imagewidth="' + imagewidth+ '"]').hide(); 
} 
</script>

這裏有一個working example

另外，我建議你的屬性：數據文件大小，數據imageheight和數據imagewidth所以你是HTML標準。

來源

2014-07-26 02:58:18 dave

這太慢了。 –

上述代碼的輸出未捕獲錯誤：語法錯誤，無法識別的表達式：[filesize =「279603」[imageheight =「500」[0124] [imagewidth =「380」' – sarbbottam

@true：你怎麼知道的？ – BoltClock

既然你有每個元素的類名，你可以得到所有具有該類的元素。最快的方法是對所有元素進行線性搜索。

function hide(filesize, imageheight, imagewidth) { 
    filesize = (filesize).toString(); 
    imageheight = (imageheight).toString(); 
    imagewidth = (imagewidth).toString(); 

    var els = document.getElementsByClassName('imagecontainer'); 

    for(var i = 0; i < els.length; ++i) { 
    var el = els[i]; 
    var fsize = el.getAttribute('filesize'); 
    var iheight = el.getAttribute('imageheight'); 
    var iwidth = el.getAttribute('imagewidth'); 

    if(fsize === filesize && imageheight === iheight && iwidth === imagewidth) { 
     el.style.display='none'; 
     break; 
    }   
    } 
}

來源

2014-07-26 03:07:07

具有特定屬性的隱藏元素

回答

相關問題