1

背景：裏庭の気象観測所からの現在の気象条件を表示する簡単なWebページがあります。WebサイトにUV画像を追加しようとしています。私は基本的なHTMLに慣れていますが、JavaScriptは私には外国語のように思えます。JavaScriptでの画像の使用と呼び出しに関するスレッドを見つけましMath.roundたが、この2つを組み合わせる方法がわかりません。

私の天気予報ソフトウェアは、小数点以下1桁のUVインデックスを出力します。整数に丸めてから、その整数を使用して、その整数に関連する画像をWebページに配置したいと思います。

Math.roundテンプレートのUVコールアウトを整数に置き換える方法を理解しました。UV用のソフトウェアのテンプレートタグはですSTAT$UV:CURRENT$。これをJavaScriptに入れると（画像ファイル全体の名前を付ける前後のテキストを含む）、次のようになります。

UV_<script type="text/javascript">document.write(Math.round(STAT$UV:CURRENT$));</script>.gif

これにより、UV_X.gif予想どおり、Xが現在のUVインデックスに等しいWebページに表示されます。しかし、これをIMGタグでラップしようとすると、目的の結果が得られません。

変数を使用する必要があると思いますが、画像を呼び出すために必要な変数と構文がわかりません。

助言がありますか？

[編集]

以下の回答で3つの提案をテストしました。画像が表示されなかったので、質問について十分に説明していなかったと思います。

天気予報ソフトウェアは私のコンピューターでローカルに実行されます。屋外の気象観測所からデータのパケットを受信し、そのデータを処理して画面に表示します。また、ローカルに保存されたテンプレートにデータを入力し、FTP経由で自分のWebサイトにアップロードします。サーバー上のいくつかのプリパッケージスクリプトを除いて、すべてがローカルで処理されます。これらの提案の私のテストページはavon-weather.com/test.htmlにあります。覗いてみて、私が間違っていることがわかるかどうかを確認してください。ありがとう！

4

3 に答える 3

2

サーバーフレームワークを使用しているため、おそらくサーバー側で数値を四捨五入する必要があります。また、document.write可能であれば回避するようにしてください。完全に理解していない場合（特に、サーバー側とクライアント側のレンダリングを混在させている場合）、いくつかのトリッキーな問題が発生する可能性があります。ただし、クライアント側でそれを行う方法の例を次に示します。

<img id="myImage" />

<script type="text/javascript">
    var imgSrc = "UV_" + Math.round(STAT$UV:CURRENT$) + ".gif";
    document.getElementById("myImage").setAttribute('src', imgSrc);
</script>
于 2012-10-20T16:23:41.793 に答える
1

document.write使用しないでください。現代的な方法は次のようになります。

<img id="set-me" />
...
<script>
  document.getElementByID("set-me").src = 
    "UV_"+Math.round(STAT$UV:CURRENT$)+".gif";
</script>

jQueryを使用する場合は、

 <img id="set-me" />
 ...
 <script>
   $("#set-me").attr("src",
     "UV_"+Math.round(STAT$UV:CURRENT$)+".gif");
 </script>
于 2012-10-20T16:25:28.343 に答える
0

<script>タグの真ん中にタグを押し込んで、<img>それが機能することを期待することはできません。PHPはHTMLとは独立してサーバー側で処理されるため、PHPで機能しますが、JavaScriptはHTMLの要素です。

代わりに、次のように、タグdocument.write()全体を確認してみてください。<img>

<script type="text/javascript">
  document.write('<img src="UV_'+Math.round(STAT$UV:CURRENT$)+'.gif"/>');
</script>
于 2012-10-20T16:21:20.657 に答える