在jQuery中找到集合中元素的匹配值，並返回該元素

我有身體一個數據節點ID屬性在jQuery中找到集合中元素的匹配值，並返回該元素

<body data-node-id="1093>

我也有，這可能是以下集合中匹配的ID .navItemParent

下

<div class="row small-up-5 navItemParent"> 
    <div class="column navItem"> 
     <a href="/" data-node-id="1093"><span class="topLineNav">Dining</span></a> 
    </div> 
    <div class="column navItem"> 
     <a href="/" data-node-id="1111"><span class="topLineNav">Dining</span></a> 
    </div> 
    <div class="column navItem"> 
     <a href="/" data-node-id="1211"><span class="topLineNav">Dining</span></a> 
    </div> 
</div>

基本上我需要看看在a標籤的任何data-node-id在body tag的當前值相匹配。

我想（在若跌破條件）

if ($(".navItemParent").find(" .navItem a").data("node-id") === $("body").data("node-id")) { 
     $(".navItemParent").find("a.active").removeClass("active"); 
     $(".navItemParent .navItem a").addClass("active"); 
    };

來源

2016-07-07 wingyip

哪來你試過jQuery代碼？ – j08691

剛剛添加了我試過的代碼@ j08691 – wingyip

這將做到這一點，我認爲：

var matches = $(".navItemParent").find('a[data-node-id="' + $("body").data("node-id") + '"]'); 
alert("Found " + matches.length + " results");

來源

2016-07-07 15:14:52 ADyson

你可以得到body節點ID，然後找到一個匹配節點ID的所有元素：

var bodyNodeID = $("body").data("nodeId"); 
var matchingNodeElements = $(".navItemParent").find("[data-node-id='" + bodyNodeID + "']");

來源

2016-07-07 15:13:50 tymeJV

抓住ID，建設選擇器並請求jQuery做這項工作

var node_id = $(document.body).attr("data-node-id"), 
    element = $('.navItemParent').find('a[data-node-id="' + node_id + '"]');

或與香草JS

var node_id = document.body.getAttribute("data-node-id"), 
    element = document.querySelector('.navItemParent a[data-node-id="' + node_id + '"]');

來源

2016-07-07 15:14:31 Andreas

您可以從身體通過該值作爲選擇的jQuery：

var nodebody = $('body').data('node-id'); 
 
$('a[data-node-id="'+nodebody+'"]').css('color','red');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<body data-node-id="1093"> 
 
<div class="row small-up-5 navItemParent"> 
 
    <div class="column navItem"> 
 
     <a href="/" data-node-id="1093"><span class="topLineNav">Dining</span></a> 
 
    </div> 
 
    <div class="column navItem"> 
 
     <a href="/" data-node-id="1111"><span class="topLineNav">Dining</span></a> 
 
    </div> 
 
    <div class="column navItem"> 
 
     <a href="/" data-node-id="1211"><span class="topLineNav">Dining</span></a> 
 
    </div> 
 
</div>

來源

2016-07-07 15:17:05 DaniP

var elementExists=$("a[data-node-id='" + $("body").data("node-id") + "']").length > 0; // will return true if found

這將是l條選擇：$("a[data-node-id='" + $("body").data("node-id") + "']")

來源

2016-07-07 15:18:37

你可以使用jQuery的attribute selector和attr function的組合，以檢查是否至少有一個a項目，其「數據節點-id」屬性是相同的body的之一。

$(function() { 
 
    // demo: just to add the `data-node-id` attribute to the `body` tag 
 
    $("body").attr("data-node-id", "1093"); 
 

 
    alert($("a[data-node-id = '" + $("body").attr("data-node-id") + "']").length > 0); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="row small-up-5 navItemParent"> 
 
    <div class="column navItem"> 
 
    <a href="/" data-node-id="1093"><span class="topLineNav">Dining</span></a> 
 
    </div> 
 
    <div class="column navItem"> 
 
    <a href="/" data-node-id="1111"><span class="topLineNav">Dining</span></a> 
 
    </div> 
 
    <div class="column navItem"> 
 
    <a href="/" data-node-id="1211"><span class="topLineNav">Dining</span></a> 
 
    </div> 
 
</div>

來源

2016-07-07 15:20:35

在jQuery中找到集合中元素的匹配值，並返回該元素

回答

相關問題