Javascript jQuery-使用特定html选择元素

我尝试选择一个具有特定html的div。看看我的例子：

$（“#单击我”）。单击（函数（）{
$（“div:contains（'heinrich'）”）.css（“背景色”、“limegreen”）
});
。正常{
宽度：100px；
高度：100px；
显示：内联块；
}
瑞德先生{
背景色：红色；
边框：1px纯黑；
}
蓝先生{
背景颜色：蓝色；
边框：1px纯黑；
}
黄先生{
背景颜色：黄色；
边框：1px纯黑；
}
#船长{
边框：10px实心灰色；
}

我最喜欢的朋友是：
汉斯
弗兰兹
海因里希
单击“我”将只生成heinrichs div limegreen
只需更改根选择器即可

更新

选择每个
div
，然后使用

克隆要筛选的
div
，选择所有子级（嵌套div），删除它们，然后“返回”到父级
克隆div
，并检索文本

获取文本后，将内容与正在搜索的文本进行比较


$（“#单击我”）。单击（函数（）{
$（“div”）.filter（函数（idx，val）{
return/heinrich/gi.test（$（this.clone（）.children（）.remove（）.end（）.text（））；
}).css（“背景色”、“灰色”）
});
。正常{
宽度：100px；
高度：100px；
显示：内联块；
}
瑞德先生{
背景色：红色；
边框：1px纯黑；
}
蓝先生{
背景颜色：蓝色；
边框：1px纯黑；
}
黄先生{
背景颜色：黄色；
边框：1px纯黑；
}
#船长{
边框：10px实心灰色；
}

我最喜欢的朋友是：
汉斯
弗兰兹
海因里希
单击“我”将只生成heinrichs div limegreen
这应该可以

    $("#clickMe").click(function(){ 
$("#masterdiv  div:contains('heinrich')").css("background-color", "limegreen")
 });

最好在选择器
$（“div.normal:contains（'heinrich'）”）中提到
className


$（“#单击我”）。单击（函数（）{
$（“div.normal:contains（'heinrich'）”）.css（“背景色”、“limegreen”）
});
。正常{
宽度：100px；
高度：100px；
显示：内联块；
}
瑞德先生{
背景色：红色；
边框：1px纯黑；
}
蓝先生{
背景颜色：蓝色；
边框：1px纯黑；
}
黄先生{
背景颜色：黄色；
边框：1px纯黑；
}
#船长{
边框：10px实心灰色；
}

我最喜欢的朋友是：
汉斯
弗兰兹
海因里希
单击“我”将只生成heinrichs div limegreen
在您的示例中，应使用不同的选择器：

$("#masterdiv > div:contains('heinrich')")

既然你不想使用ID，我建议你试试这个

   $('div > div:contains(heinrich)').css("background-color", "limegreen")

工作小提琴：
试试这个

$("#clickMe").click(function(){
        var html_trg="heinrich";
    $('.normal').each(function(i,u){
            var divtxt=$(u).html();
        divtxt=$.trim(divtxt);
            if(divtxt==html_trg){
          $(u).css("background-color", "limegreen");
        }
    });
});

试试这个，会有用的

  $("#clickMe").click(function(){
        $("div#masterdiv").find('div.normal:contains(heinrich)').css("background-color", "limegreen")
    });

太好了，这不需要像请求的那样使用ID。谢谢@黑色更新回答：干得好！好的解决方案不仅仅是
div
选择器，您可以将选择器缩小到原始的
div:contains（'heinrich'）