Рассчитать текст jQuery(). Длина видимых элементов без удаления скрытых элементов

Question

Я думаю, что это небольшая проблема, но я как-то застрял.

Рассмотрим следующий код

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); 

Теперь я хочу, чтобы вернуть Сэму e 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); 

Answer 1

Основываясь на входах @kasper и @Richard

Я попытался сделать это:.

оповещения ($ ('div.india') текст() .length - $ ('div.india'). find (": hidden"). text(). length);

и получил правильный ответ. Спасибо за помощь.

Теперь это будет большой вопрос, если мы можем выяснить, почему клон возвращается 21

Answer 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()); 

, когда я тестировал

Answer 3

случае один и два дифференциала различны, потому что ... (см комментарии в коде)

//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

Answer 4

я нашел, почему метод клон дает другой результат ...

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

вы не может использовать: видимый или: скрытый элемент клонирования, если он не находится в dom. Однако вы можете проверить, есть ли у них определенный класс или нет.

$('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);