1

我认为这是一个小问题，但不知何故我被卡住了。

考虑以下代码

HTML：

<div class="india">
   <p class="hidden"> Uttar Pradesh </p>
   <p> Andhra Pradesh </p>
   <p class="hidden"> Uttar Pradesh </p>
   <p> Andhra Pradesh </p>
</div>

CSS：

.hidden{
   display: none;
}

JAVASCRIPT：

/* Case 1: No of char inside div when hidden elements are removed
RETURNS 53 */
$('div.india').find(":hidden").remove();
alert($('div.india').text().length);

现在我想在不删除隐藏元素的情况下返回相同的长度（=53）。我尝试过做以下事情（一个接一个/或在一个单独的类似 div 上），但它们都返回不同的长度

如何在不删除隐藏元素的情况下返回相同的长度？欢迎解释为什么它们的长度不同！

链接：http: //jsfiddle.net/deveshz/R2QNM/1/

// Without Removing hidden div RETURNS 32
/*Case 2: */
alert($('div.india').find(":visible").text().length);

/* Case 3 */
var charlength = 0;
$('div.india').find(":visible").each(function(){
    charlength += $(this).text().length;
});
alert(charlength);

/*Case 4 RETURNS 21*/ 
var clone = $('div.india').clone();
clone.find(":hidden").remove();
alert(clone.text().length);
4

4 回答 4

2

这个

$('div.india').find(":hidden").remove();
alert($('div.india p').text());
alert($('div.india p').text().length);

似乎给出了相同的结果

alert($('div.india').find(":visible").text().length);
alert($('div.india').find(":visible").text());

当我测试它时

于 2013-09-30T14:34:39.700 回答
1

我发现为什么克隆方法会给出其他结果......

http://jsfiddle.net/kasperfish/R2QNM/3/

如果克隆元素不在 dom 中，则不能在克隆元素上使用 :visible 或 :hidden 。但是，您可以检查他们是否有特定的课程。

$('div.india').find(":hidden").remove();
alert('not clone '+$('div.india').text().length);


var clone = $('div.newindia').clone();

alert('clone '+ clone.find("p:not(.hidden)").text().length);
于 2013-09-30T15:40:42.043 回答
1

基于@kasper 和@Richard 的输入

我试过这样做：

alert($('div.india').text().length - $('div.india').find(":hidden").text().length);

并得到了正确答案。谢谢您的帮助。

现在，如果我们能找出 clone 返回 21 的原因，这将是一个很好的问题

于 2013-09-30T14:55:29.760 回答
1

案例一和二是不同的，因为......（见代码中的注释）

    //Case 1: No of char inside div when hidden elements are removed
    RETURNS 53 */
    $('div.india').find(":hidden").remove();
    alert($('div.india').text().length);//here your selector is a div
    alert($('div.india p').text().length);//here it is a p tag... ->32



    // Without Removing hidden div RETURNS 32
    /*Case 2: */
    alert($('div.newindia').find(":visible").text().length);//here your selector points to a visible p tag

我正在考虑克隆案... :-/

编辑：删除了我的部分答案，因为我在 jsfiddle 中做错了

于 2013-09-30T14:35:49.893 回答