Question

我的页面上有一系列div，当字符串保存在数组中时，我无法选择包含特定字符串的每个div。例如，如果array = ['foo'，'qux']，我希望能够选择包含'foo'的div，以及包含'qux'的div。

<div class="word word1">foo</div>
<div class="word word2">bar</div>
<div class="word word3">baz</div>
<div class="word word4">qux</div>

脚本

array =  ['foo', 'qux'];
for (var i = 0; i < array.length; i++) {
  array_text = array[i];
  alert( $( "div:contains(array_text)" ).text() );
}

我也使用过这个脚本但没有成功：

correct_matches =  ['foo', 'qux'];
$.each(correct_matches, function(index, value){
  alert( $( "div:contains(value)" ).text() );
  }
);

我只使用警报来确定$（“div：contains（array_text）”）选择器是否正常工作。选择器是我遇到问题的地方：$（“div：contains（'bar'）”）按预期工作。一旦我使用array_text变量，我得到一个空字符串的警报。有什么建议？谢谢。

Answer 1

选中 FIDDLE 。

您正在测试文件array_text是否包含在div。

中

我不确定这是否是最优的，但它确实有效。

jQuery版本：

$(function () {

    var array = ['baz', 'qux'];
    for (var i = 0; i < array.length; i++) {
        array_text = array[i];
        $('div').each(function () {
            if ($(this).text() == array_text) {
                alert(array[i]);
                // do more stuff with $(this) (which is the div)
            }
        });
    }
});

Answer 2

var array =  ['foo', 'qux'];
var elements = document.querySelectorAll(".word"); // get all elements of class word

for(var i =0;i <array   .length;i++ ) // first loop for your array
for(var ii=0;ii<elements.length;ii++) // second loop for the elements in the collection
if(array[i] == elements[ii].innerHTML){ // check for matches
  elements[ii]; // this is the handle to the html element
}

运行两个集合并检查两个集合之间是否匹配。

jQuery / Javascript：遍历数组以从数组值中选择div

2 个答案: