1

つまり、基本的には、私が持っている HTML 要素からインライン スタイルを変更しようとしているだけです。

たとえば、私のh1タグ：

<h1 id="headerTop" style="width: 500px; max-width:none; top: 234px;">Something goes here</h1>

topページがロードされた後、別のものに変更しようとしています。bodyしたがって、タグを閉じる直前に、次の Javascript を使用しようとしています。

<script>
     document.getElementById("headerTop").style.top = "470px";
</script>

ただし、これは変更されません。

私のh1要素は元々top、ブラウザ内にロードされるまでページソース内に属性を持たないため、これを実行しようとしています。それが与えられtop: 234px;ます。理由が分からないようです。別のサイトから購入したテンプレートを使用しているため、どこかに原因があるはずです。top属性は間違いなくインラインで追加されています。

4

5 に答える 5

4

最初に絶対位置または相対位置を追加して、変更を確認します

JavaScriptで

html

<body onload="myFunction()">

js 

<script>
function myFunction()
{
 document.getElementById("headerTop").style.top = "470px";
}
</script>

jqueryではボディタグを追加する必要はありません

$(document).ready(function(){

$("#headerTop").css("top","470px");
});
于 2013-10-17T08:39:21.923 に答える
2

設定する必要がありますposition:relative

配置された要素で上、左、右、下を設定できます

したがって、必要に応じて設定position:relativeするか、またはabsolute設定してください。

例

アップデート

すでに適用position:relative済みだとおっしゃっているように、直前にスクリプトを書いてみ</body>て、どうなるか見てみましょう。

于 2013-10-17T08:41:03.257 に答える
1

テンプレートはおそらく、ドキュメントのオンロード関数または jquery の準備が整った関数にフックされ、何らかの計算を行い、プロパティを追加します。

これをオーバーライドする際の問題は、テンプレートが作業を完了した後にそれを実行していることを確認する必要があることです。そうしないと、テンプレートが変更を上書きするだけです。

onload にフックすると、おそらく早すぎます。

テンプレートの JavaScript コードを直接変更するのはどうですか?

jquery ready 関数を使用することもできますが、これが影響を与えるかどうかは、テンプレートの前または後に登録されているかによって異なります。document.ready() コールバックは、登録された順序で呼び出されます。

$(document).ready(function() {
    $("#headerTop").css("top","470px");
});

また、上/左/右/下を使用して要素を配置するには、配置コンテキストを作成する必要があります。position:relativeこれは、 h1 要素にset を追加することで簡単に実行できます。

于 2013-10-17T08:41:10.663 に答える
1

jquery の方法は次のようになります。

<script>
$(document).ready(function(){
  $('#headerTop').css({
    'top': '470px'
  });
})
</script>

これにより、「headerTop」の ID を持つ要素の css プロパティ top が 470px に変更されます。

JavaScript の実行を遅らせる必要がある場合は、次のようにします。

<script>
$(document).ready(function(){
  setTimeout(function(){
    $('#headerTop').css({
      'top': '470px'
    });
  },1000)
})
</script>

これにより、実行が 1 秒遅れます。おそらく理想的ではありませんが、それでも解決策です。

于 2013-10-17T08:42:37.193 に答える