Question

我正在尝试创建一个遍历网页的javascript函数，并查找类名"option"的所有标记，并隐藏与下面显示的每个if语句中的文本匹配的标记。

在下面的示例中，我尝试使用jquery来获取类，但它只获取具有该名称的第一个类，而不是该名称的所有类。

我还尝试使用var element = document.getElementsByClassName('option');查看是否可行但是当我遍历元素列表并将其显示更改为无时，更改未显示。

迭代一个类列表并更新某些元素的css的更好方法是什么？

感谢任何帮助。感谢。

$(document).ready(function(){

if($('.option').html() == "C.&nbsp;"){
    $('.option').css('display','none');
}
if($('.option').html() == "D.&nbsp;"){
    $('.option').css('display','none');
}
if($('.option').html() == "E.&nbsp;"){
    $('.option').css('display','none');
}
if($('.option').html() == "F.&nbsp;"){
    $('.option').css('display','none');
}
});

Answer 1

如果我明白你想要什么，这应该有效：

$(document).ready(function(){
    $('.option').each( function(i,e) {
        var current = $(e).html();
        if (current == "C" || current == "D" || 
            current == "E" || current == "F") {
           $(e).hide();
        }
});

Answer 2

使用.each函数

$('.option').each(function(index) {
    if($(this).html == "E")
       $(this).hide();
});

Answer 3

您只获得一个元素，您只需操作$('.option')调用返回的jQuery对象中的“first”元素。你需要的是jQuery的.each()函数，以便遍历jQuery调用返回的所有元素。此外，long if语句可以缩短，但我认为你知道并有其他目的。无论如何，一旦调用了.each，你就可以使用回调函数来操作EACH元素。这很像for循环。以下示例中的参数i表示迭代对象时元素的索引值。它基于0，换句话说，要传递的第3个选项元素会将参数i设置为2

试试这个＆amp;＆amp;祝你好运：

$(function() {
    $(".option").each(function(i) {
        var txt = $(this).text();
        if (txt == "C." || txt == "D." || txt == "E." || txt == "F.")
            $(this).hide();
    });
})

要调查的替代链接

.html()
- 使用此方法获取或设置元素的innerHtml
.val()
- 使用此方法获取或设置元素的值
  - 主要是HTML标记select，input，＆amp;＆amp; textarea

Answer 4

$('.option').html()只会获得第一个元素的innerHTML。如果您想查看所有这些内容，则需要使用$.each。

$('.option').each(function(){
    if($.inArray($(this).html(), ['C', 'D', 'E', 'F']) !== -1){
        $(this).hide();
    }
});

Answer 5

我看到你正在使用jQuery。当您使用jQuery函数（如$（'。option'））包装一些类时，您将获得一个元素集，这意味着它将包含所有包含在特殊jQuery类中的元素，这些元素为您提供了许多功能

迭代通过元素集的最佳方法是使用jquery .each（）函数，http://api.jquery.com/jQuery.each/ 它会将回调函数应用于每个元素。像这样：

$(document).ready(function(){
    $('.option').each(function() {
        //Here you can access coresponding element to each iteration with this kyeword
        // you can wrap it again like this $(this) and get all of jQuery functionality on that object again
        $(this).hide();
    });
}

Answer 6

试试这个：

$(document).ready(function(){
  $('.option:contains("C.")').hide();
  $('.option:contains("D.")').hide();
  $('.option:contains("E.")').hide();
  $('.option:contains("F.")').hide();
});

JQuery选择器'.option:contains("C.")'查找包含文本“C”的option类的所有标记，.hide()函数隐藏该集合中的每个元素。

http://jsfiddle.net/b3hVw/

或者，在一个声明中：

$(document).ready(function(){
    $('.option').filter(function() {
        var html = $(this).html();
        return html === "C." || html === "D." || html === "E." || html === "F.";
    }).hide();
});

$('.option')找到option类的所有元素。 .filter(function() { ... })调用过滤器只列出过滤器函数返回true的那些过滤器，然后对.hide()的调用隐藏了这些元素。

http://jsfiddle.net/H7Lu8/

$（。class）仅对该类名的第一个标记执行

6 个答案: