jQuery動態創建元素

Question

我有一個使用ColorBox的JavaScript函數。 <a rel鏈接指向自動分配給日期的文件夾（即20140806）。 我將如何使其更加高效，所以不必像下面的示例那樣在每個日期中都這樣做

<script type="text/javascript">
$(document).ready(function(){
    $("a[rel='20140804']").colorbox();
    $("a[rel='20140805']").colorbox();
    $("a[rel='20140806']").colorbox();
});
</script>

Answer 1

您可以使用前綴匹配來捕獲任何以201開頭的rel屬性（或20 ，以在本世紀余下的時間工作）：

$(document).ready(function(){
  $("a[rel^='201']").colorbox();
});

請參閱屬性以選擇器開頭

Answer 2

您也可以：

$("a").each( function(){

   if ( $(this).attr(rel) == 'myValue' ){
       $(this).colorbox();
   }
});

對於文檔中的每個超文本，請檢查“ rel”屬性是否與所需屬性匹配

Answer 3

正如Rocket Hazmat所說 ，您可以將CSS類添加到要向其應用顏色框的鏈接。 在形成HTML鏈接和rel屬性的位置，您必須添加一個CSS類，因此HTML如下所示：

<a href="/link/to/the/folder_1" class="colorbox-me">Folder 1</a>
[...]
<a href="/link/to/the/folder_N" class="colorbox-me">Folder N</a>

<script type="text/javascript">
$(document).ready(function(){
    $("a.colorbox-me").colorbox();
});
</script>

不建議將rel屬性用於任何目的，除非描述當前文檔與鏈接文檔的關系。 rel屬性通常由搜索引擎使用。 rel屬性的可能值可在此處找到。