如何使用内部 html 选择类

How do I select a class with Inner html?

本文关键字：选择 html 内部 何使用      更新时间：2023-09-26

所以我有两个div：

<div class="someGenericClass">1 Item</div>
<div class="someGenericClass">Another Item</div>

如果给我两个变量：

classVariable = ".someGenericClass";
innerHTMLVariable = "Another Item";
如果我在向

该部分添加 ID 时没有发言权，我如何根据类选择第二个div 元素，然后选择 innerHTML。使用 javascript 或 jQuery。我知道这不是按 innerHTML 搜索的最佳选择，但我在添加 ID 等方面没有发言权，而且我不能依赖div 按固定顺序排列。

$(classVariable).somehowInnerHTML?

谢谢

好吧，您已经知道按元素内部HTML内容搜索不是很可靠，所以。我会给你一些提示，告诉你如何做到这一点。

1）. 使用纯 Javascript，我会使用 Array 的过滤方法：

var classVariable = ".someGenericClass";
var innerHTMLVariable = "Another Item";
var found = [].slice.call(document.querySelectorAll(classVariable)).filter(function(div) {
    return div.innerHTML === innerHTMLVariable;
});

此代码将找到所有内部HTML内容等于innerHTMLVariable的div。

2）. 使用 jQuery：

$(classVariable + ':contains(' + innerHTMLVariable + ')');

上面的代码并不等同于纯 js 版本，因为它使用:contains选择器，所以它匹配有文本内容的div，但当然它也会匹配<div class="someGenericClass">Some text Another Item content</div>。

jQuery 等效项将是

$(classVariable).filter(function() {
    return $(this).text() === innerHTMLVariable;
});
您可以使用 

$(".someGenericClass:contains('Another Item')" ).<any action you want to do in this element>

获取变量中的对象：

var variable = $(".someGenericClass:contains('Another Item')" );
相关文章：