如何使用jQuery在页面上基于另一个随机元素编辑随机元素?

问题描述 投票:1回答:2

我不知道在jquery中是否有这样的选项,我尝试过“查找,包含,有”选择器,但无法实现我所需要的。

我有一个我无法访问的软件代码,所以要改变布局我只能摆弄CSS和jQuery。

这是示例代码:

<div class="form-group">
    <label>Filter by Day</label>
    <div>
        <label for="chkDayWednesday" class="cpv-checkbox font-weight-normal">
            <input type="checkbox" name="chkDayWednesday" id="chkDayWednesday" checked="checked">
            <i></i>
            Wednesday
        </label>
        <br>
        <div style="margin-top: -6px; margin-bottom: -18px;">
            <label for="chkDayThursday" class="cpv-checkbox font-weight-normal">
                <input type="checkbox" name="chkDayThursday" id="chkDayThursday" checked="checked">
                <i></i>
                Thursday
            </label>
        </div>
    </div>
</div>

我需要在下面的div中添加样式:

<div style="margin-top: -6px; margin-bottom: -18px;">

问题是在页面上有多个类,如:.form-group。我只能使用一个独特的元素,它是:

id="chkDayWednesday"

要么

id="chkDayThursday"

所以问题是,如何基于页面上的这些独特元素,我可以向上或向下到具有负边距的div并编辑它?

我试过这样的事情:

$("label:contains('Thursday')").css({"background-color": "yellow"});

但它只选择标签本身。

jquery jquery-ui
2个回答
2
投票

你试过.closest()吗?找到最接近的父元素。例:

$("label:contains('Thursday')").closest("div").css("background", "yellow");

2
投票

根据我对你想要将background-color:yellow添加到带有id div的孩子的chkDayThursday这个问题的理解,因为我们没有适当的CSS方法来实现这一点,所以我们可以选择一个众所周知的JQuery。只需找到id为chkDayThursday的元素,然后找到片段中显示的父div并设置样式!

如果我错过了什么,请告诉我,因为我的理解有点模糊!

$('#chkDayThursday').parent().parent().css({"background-color": "yellow"})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="form-group">
    <label>Filter by Day</label>
    <div>
        <label for="chkDayWednesday" class="cpv-checkbox font-weight-normal">
        <input type="checkbox" name="chkDayWednesday" id="chkDayWednesday" checked="checked">
        <i></i>
            Wednesday
        </label>
        <br>
        <div style="margin-top: -6px; margin-bottom: -18px;">
            <label for="chkDayThursday" class="cpv-checkbox font-weight-normal">
                <input type="checkbox" name="chkDayThursday" id="chkDayThursday" checked="checked">
                <i></i>
                Thursday
            </label>
        </div>
    </div>
</div>