0

ドキュメント内のすべての要素にdivを追加したいと思います。divは、それらが追加される要素と同じheightである必要があります。weightを取得するにはheight、width次のような変数を設定します。

var height =   $(this).height();
var width =   $(this).width();

そして、このように追加します：

$('*').append('<div class="over" style="height:'+height+';width:'+width+';">'+height+' + '+width+'</div>');

このフィドル（リンク）でわかるように、実際にはうまくいきません。251 + 420どの要素もこれらの次元を持っていないので、それは私に奇妙な同じ次元を与えます。

div.overドキュメント内のすべての(*)要素にを追加し、そのサイズを追加先の要素に設定するにはどうすればよいですか？（使用する必要があります.eachか？）

4

5 に答える 5

2

1回だけでなく、各オブジェクトの高さ/幅を取得する必要があります。このフィドルを見る

$('body *').each(function (i, v) {
    var $this = $(this),
        h = $this.height(),
        w = $this.width();
    $this.css({ height: h, width: w * 2 });
    $this.append('<div class="over" style="display:block; height:' + h + 'px !important;width:' + w + 'px !important;">' + h + ' x ' + w + '</div>');
});
于 2013-03-16T19:33:26.037 に答える
1

append()次のように関数構文を使用できます。

$('body *').append(function(){ 
    var height = $(this).height(),
        width  = $(this).width();

    return '<div class="over" style="height:'
            +height+';width:'+width+';">'+height+' + '+width+'</div>'; 
});

注：セレクターを変更しました。そうしないと、などの要素をループしてしまい<head>、ランダムな不規則性が発生する可能性があります。

これがデモです。

于 2013-03-16T19:33:40.617 に答える
1

このようなものが機能するはずです：

$('body *').each(function(i,el){
    var height = $(el).height();
    var width = $(el).width();
    $(el).append('<div class="over" style="height:'+height+';width:'+width+';">'+height+' + '+width+'</div>');
});

編集：ボディタグの外側にdivを取得する以外のすべてだけでなく、ボディ内のすべてをターゲットにする必要があります。

于 2013-03-16T19:33:58.037 に答える
1

各関数ですべての要素を繰り返し処理します。

$('*').each(function(index, element){
    $(element).append('<div class="over" style="height:'+$(element).height()+';width:'+$(element).width()+';">'+$(element).height()+' + '+ $(element).width()+'</div>'); 
});

実例：http： //jsfiddle.net/d4k6g/4/

于 2013-03-16T19:34:57.407 に答える
1

これが解決策になるかもしれません：

$('body *').each(function(){
    var t = $(this), w = t.width(), h = t.height();
    t.append('<div class="over" style="height:'+h+'px;width:'+w+'px;">'+h+' + '+w+'</div>');
});
于 2013-03-16T19:52:05.347 に答える