0

我有一小部分项目，如下所示。

    <div class="item">
        <div class="date">2013-08-08</div>
        <div class="headline"><a data="normal" href="#">Title</a></div>
    </div>

    <div class="item">
        <div class="date">2013-10-08</div>
        <div class="headline"><a data="special" href="#">Title</a></div>
    </div>

如果标题具有特殊的数据属性，我只想将该项目的日期设为粗体。我有下面的代码来尝试这样做。

    <script>
        if ($(".headline a [data='special']")){
            $( ".date" ).wrap( "<b></b>" );
        }
    </script>

但是，如果条件为真，这会使所有项目变为粗体。我熟悉在 JS 中使用它，但不知道如何将它与上面的另一个 div 相关联。

做这个的最好方式是什么？如果需要，我也很乐意更改 html 结构。

4

2 回答 2

2

尝试以下操作：

$(".headline a[data='special']").parent().siblings(".date").wrap("<b></b>");

该parent()函数将选择div.headline匹配的<a>标签；然后，将选择具有日期siblings(".date")类的父级div.headline（称为兄弟姐妹）的子级。

于 2013-09-26T22:03:20.023 回答
1

听起来您想在包含元素的.date元素中.item选择.headline a[data="special"]元素。

$('.item:has(.headline a[data="special"]) .date')

将为我给定的假设选择正确的.date元素，然后您可以调用.wrap('<b></b>').

另请注意：[data]不是有效的[data-*]属性。自定义数据属性必须有一个连字符和一个名称。

于 2013-09-26T22:12:34.050 回答