0

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

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

我也尝试过使用var element = document.getElementsByClassName('option');它来查看是否可行，但是当我遍历元素列表并将它们的显示更改为无时，更改没有显示出来。

什么是遍历类列表并仅更新某些元素的 css 的更好方法？

任何帮助表示赞赏。谢谢。

$(document).ready(function(){

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

6 回答 6

1

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

$(document).ready(function(){
    $('.option').each( function(i,e) {
        var current = $(e).html();
        if (current == "C" || current == "D" || 
            current == "E" || current == "F") {
           $(e).hide();
        }
});
于 2012-11-19T21:48:50.577 回答
1

使用 .each 函数

$('.option').each(function(index) {
    if($(this).html == "E")
       $(this).hide();
});
于 2012-11-19T21:49:28.367 回答
1

你不会只得到一个元素，你只是简单地操作$('.option')调用返回的 jQuery 对象中的“第一个”元素。您需要的是 jQuery 的.each()函数，以便遍历 jQuery 调用返回的所有元素。此外，长 if 语句可以缩短，但我假设您知道这一点并有其他目的。无论如何，一旦 .each 被调用，您就可以使用回调函数在每个元素通过时对其进行操作。这很像一个 for 循环。下例中的参数i表示迭代对象时元素的索引值。它是基于 0 的，换句话说，要通过的第三个选项元素会将参数设置i为2

试试这个&&祝你好运：

$(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, &&textarea
于 2012-11-19T21:50:50.260 回答
1

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

$('.option').each(function(){
    if($.inArray($(this).html(), ['C', 'D', 'E', 'F']) !== -1){
        $(this).hide();
    }
});
于 2012-11-19T21:51:13.993 回答
1

我看到你正在使用 jQuery。当你用 $('.option') 这样的 jQuery 函数包装某个类时，你会得到一个元素集，这意味着它将包含包装在特殊 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();
    });
}
于 2012-11-19T21:58:04.577 回答
0

试试这个：

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

JQuery 选择器查找包含文本“C.”'.option:contains("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/

于 2012-11-19T21:47:38.033 回答