1

タイトルとして少しのテキストを持ち、ページの端まで取り消し線を付けてテキストをたどる行区切りを作成しようとしています。セパレータdivの各インスタンスで関数を呼び出すためにjqueryのビットを適切に書いていると思っていましたが、どうやらそうではありません。

これが私がそうあるべきだと思ったものです:

$(".separator").each(function() {
    var linewidth = 706 - $(".s-text").width();
    $(".s-line").width(linewidth);
}); 

ここでフィドルを参照してください:http://jsfiddle.net/WY7tL/

4

3 に答える 3

8

解決

選択する要素を指定する必要があります.s-text。この場合は、選択した の.separatorです。


説明

$.each()、または$('selector').each()指定したセレクタクエリに対応するすべての要素をループします。

ループに入るたびに、対応する要素の配列のインデックスに対応する特定の要素が選択され、変数に割り当てられますthis

thisJQuery オブジェクトではなく、DOMElement です。これが、括弧で囲み、JQuery ( $) オブジェクトを呼び出す理由です: $(this).


JavaScript/jQuery

$(".separator").each(function() 
{
    var linewidth = 706 - $(this).find(".s-text").width();
    $(this).find(".s-line").width(linewidth);
}); 

純粋な JavaScript

var sep = document.getElementsByClassName('separator');
for (var i in sep)
{
    if(sep[i].nodeType==1)
    {
        var linewidth = 706 - sep[i].querySelector('.s-text').offsetWidth;
        sep[i].querySelector('.s-line').style.width = linewidth+"px";
    }
}

JQuery ライブ デモ

純粋な JavaScript のデモ

性能比較

于 2013-08-01T14:35:06.980 に答える
1

http://jsfiddle.net/WY7tL/1/

あなたは呼び出す必要が$(this).children('.class') あります フィドルのコードを見てください

于 2013-08-01T14:35:30.760 に答える
0

.separator関連する要素を呼び出しfind()て、内部から取得する必要があります

$(".separator").each(function() {
    var linewidth = 706 - $(this).find(".s-text").width();
    $(this).find(".s-line").width(linewidth);
}); 
于 2013-08-01T14:38:36.977 に答える