Question

我试图用Value2隐藏div。到目前为止，我尝试过很多东西但没有成功。以下是示例HTML代码

<thead class="line-item-grid-header">
    <tr>
        <th>
            <div>Value1</div>
        </th>
        <th>
            <div>Value2</div>
        </th>
    </tr>
</thead>

我试图隐藏第二个div。

有什么想法吗？

Answer 1

隐藏'div'

$("thead.line-item-grid-header tr th div:contains(Value2)").hide();

隐藏'th'

$("thead.line-item-grid-header tr th:contains(Value2)").hide();

请参阅示例 http://jsfiddle.net/JURSU/1/

Answer 2

通常情况下，您首先会识别<table>，但没有该信息：

$('th:contains(Value2)').hide();

请注意，上述内容会将“Value2”作为任何其他文本的一部分，因此“Value21”也会使其匹配。

对于更健壮的东西，严格匹配“Value2”，以及忽略前导和尾随空格，然后：

$('th').filter(function () {
    return $.trim($('div', this).text()) == "Value2";
}).hide();

Answer 3

始终尝试为您需要访问的元素提供id，以获取值，切换可见性等。它可以让您的生活更轻松，并防止您的人为错误。否则你可以指定类名并通过jquery访问它们来处理它们。

例如：

<thead class="line-item-grid-header">
<tr>
    <th>
        <div>Value1</div>
    </th>
    <th>
        <div id='mydiv'>Value2</div>
    </th>
</tr>
</thead>

 <script type="text/javascript">
 $(function () {
        $("#bthidemydiv").click(function () {
 $("#mydiv").hide();
});
});
</script>

希望这有帮助

Answer 4

我建议你添加一些类值（即使没有为该类定义明确的css样式）或者为你的div添加一些id。

这样你就可以通过id或class直接找到它们。

另一个解决方案是将id或class赋予父div，然后遍历您想要访问的div。

如果内容发生变化，找到包含文本的div可能会中断。

如果文本总是固定的，那么你可以走那条路。

我刚试过这个，它有效。请尝试让我知道它是怎么回事......

<script type="text/javascript">
    $(function () {
        $('.line-item-grid-header div').each(function () {
            alert('div');
            var txt = $(this).text();
            if (txt === 'Value2'){
                //$(this).text('Value 3');
                $(this).hide();

                //break out of loop
                return false;
            }
        });
    });
</script>

使用jQuery隐藏内部div标签？

4 个答案: