回答編集履歴
1
document.write()を使わずに画面出力する例
test
CHANGED
|
@@ -3,3 +3,47 @@
|
|
|
3
3
|
|
|
4
4
|
|
|
5
5
|
文字列くくるのに全角クォートを「あり」としている記事は見たことないですね。
|
|
6
|
+
|
|
7
|
+
|
|
8
|
+
|
|
9
|
+
|
|
10
|
+
|
|
11
|
+
# document.write()を使わずに画面出力する例
|
|
12
|
+
|
|
13
|
+
```html
|
|
14
|
+
|
|
15
|
+
<html>
|
|
16
|
+
|
|
17
|
+
<body>
|
|
18
|
+
|
|
19
|
+
<div id="price"></div>
|
|
20
|
+
|
|
21
|
+
<script>
|
|
22
|
+
|
|
23
|
+
var str;
|
|
24
|
+
|
|
25
|
+
str = "¥"+(100 + 80);
|
|
26
|
+
|
|
27
|
+
document.getElementById("price").innerHTML = str;
|
|
28
|
+
|
|
29
|
+
</script>
|
|
30
|
+
|
|
31
|
+
</body>
|
|
32
|
+
|
|
33
|
+
</html>
|
|
34
|
+
|
|
35
|
+
```
|
|
36
|
+
|
|
37
|
+
[getElementById()](https://developer.mozilla.org/ja/docs/Web/API/Document/getElementById)で出力箇所の特定を行い、そこにinnerHTMLで「対象のHTMLエレメントの中にテキストを挿入」します。
|
|
38
|
+
|
|
39
|
+
innerHTMLではなくtextContentというのもありますが、&部分が&と変換されるため、innerHTMLにしています。
|
|
40
|
+
|
|
41
|
+
対象の箇所にidが指定したため、getElementById()というのを使いましたが、getElement(s)～と言う機能は沢山あり、適宜使い分けると良いです。
|
|
42
|
+
|
|
43
|
+
nameからとるものタグ名からとるもの等など。
|
|
44
|
+
|
|
45
|
+
|
|
46
|
+
|
|
47
|
+
ちなみに[console.log()](https://developer.mozilla.org/ja/docs/Web/API/Console/log)は調べてもらえれば分かりますが、ブラウザの開発ツールのコンソールに出力するもので、いわゆる「[デバッグ](https://qiita.com/snoguchi/items/8f6bb62a3166eca23ac3)」に使うものです。
|
|
48
|
+
|
|
49
|
+
変数に想定通りの値が入っているか確かめたり、ifなどで処理に分岐をかけているときに想定の箇所を通っているか確認したりするときに使います。画面には出力しません。
|