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

ジャバスクリプト:

/* 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) を返したいと考えています。次のことを試しました（1つずつ/または別の同様の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

ケース 1 と 2 が異なる理由は... (コード内のコメントを参照)

    //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 に答える
1

@kasper と @Richard の入力に基づく

私はこれをやってみました：

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

そして正しい答えを得ました。ご協力ありがとうございました。

クローンが 21 を返す理由を突き止めることができれば、これは大きな問題になるでしょう。

于 2013-09-30T14:55:29.760 に答える
1

clone メソッドで別の結果が得られる理由がわかりました...

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 に答える