（Javascript / jQuery）使用帶有特定文本的ap定位div

Question

我現在正努力奮斗幾個小時，如何定位包含ap並帶有指定文本的div

的HTML

<div class="NavBar_Row_Button2"><p>DONATE</p></div>
<div class="NavBar_Row_Button2"><p>CONTACT</p></div>
<img src="Design/Erk%20logo.png" alt="Erk Logo" id="NavBar_Logo">
<img src="Design/ycoGM9dcE.png" id="Drop_Menu">

jQuery'

$(document).ready(function(){
  $('.NavBar_Row_Button2 P').hover(function(){
    $(this).css('color', '#00ddcb'); 
    $(this.parentElement).css('background-color', '#00ddcb');    
  });

  $('.NavBar_Row_Button2 P').mouseleave(function(){
      $(this).css('color', 'white'); 
      $(this.parentElement).css('background-color', 'white');
  });

  $('.NavBar_Row_Button1 P').hover(function(){
      $(this).css('color', '#00ddcb'); 
      $(this.parentElement).css('background-color', '#00ddcb');
  });
  $('.NavBar_Row_Button1 P').mouseleave(function(){
      $(this).css('color', 'white'); 
      $(this.parentElement).css('background-color', 'white');
  });
  if ($(this).is('div:contains("HEY")')) {
      alert('right')  
  };
});

因此，您也可以看到我更改了一些背景顏色，但是如果帶ap且帶有特殊文本的spfic div為：hover，我也想對圖像進行某些操作：懸停如何定位此spefic對象，在這種情況下，這是具有div的div

捐

嘗試過諸如包含和其他東西之類的東西，但對我不起作用

Answer 1

$('.NavBar_Row_Button2 P').hover(function(){
    if($(this).text() == 'Text you are looking for')
    {
      $(this).css('color', '#00ddcb'); 
      $(this.parentElement).css('background-color', '#00ddcb');
    }
});

Answer 2

您可以使用:contains()選擇器：

$('.NavBar_Row_Button2 p:contains("DONATE")').hover(function(){
    $(this).css({'color': 'red'});
});

但是，我可能建議您嘗試使用其他識別方法，以將文本內容與行為分開，例如添加類或其他屬性以識別目標。

Answer 3

由於看起來好像不是為這些<p>元素動態生成文本，所以為什么不只給它們一個唯一的ID並選擇這種方式呢？ 就像是：

HTML：

<div class="NavBar_Row_Button2">
   <p id="donate">DONATE</p>
 </div>

JavaScript：

$('#donate').hover(function() {
 //Whatever you want to do here
});