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

您可以使用前缀匹配来捕获以rel开头的任何201属性（或20，以便在本世纪剩下的时间内使用）：

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

请参阅Attribute Starts With Selector

Answer 2

你也可以这样做：

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

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

对于文档中的每个超文本，检查'rel'属性是否与您想要的匹配

Answer 3

作为Rocket Hazmat said，您可以将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属性的可能值here。

jQuery动态创建元素

3 个答案: