回答編集履歴
3
appendChildさせる変数が間違っていたので修正
answer
CHANGED
|
@@ -22,8 +22,9 @@
|
|
|
22
22
|
const newItem = document.createElement('div');
|
|
23
23
|
|
|
24
24
|
// itemを代入し直してないので、下記のようにidを変えたい要素の変数を変更でオーケー
|
|
25
|
-
newItem.id = item;
|
|
25
|
+
newItem.id = item;
|
|
26
|
+
// appendChildさせる要素を、今回追加した変数に変更
|
|
26
|
-
results.appendChild(
|
|
27
|
+
results.appendChild(newItem);
|
|
27
28
|
|
|
28
29
|
//要素が追加されたか確認
|
|
29
30
|
document.getElementById(item).textContent += "テスト";
|
2
文章の見やすさや、コメントアウトの誤表現を修正
answer
CHANGED
|
@@ -3,7 +3,9 @@
|
|
|
3
3
|
|
|
4
4
|
[[HTML, CSS, JavaScript] id名/class名に使用できる文字の種類 · GitHub](https://gist.github.com/think49/d8fbcf7f1c743e21bc79bb7d16178cad)
|
|
5
5
|
（公式ではないですが、公式の引用があるので、かなり信用できる内容です）
|
|
6
|
+
~~また、実際に使用しても、~~
|
|
6
|
-
|
|
7
|
+
ただし、**CSSがきかない**~~、JSでのコントロールでエラーが起きたりなど、~~**という弊害**がでます。
|
|
8
|
+
（CSSでコントロールしない限りは大丈夫かと思います）
|
|
7
9
|
~~（HTMLでid定義した要素は、JavaScript上で、そのid名だけで取得できる→JavaScriptでは数値が頭文字の変数定義は許可されていない、など）~~
|
|
8
10
|
|
|
9
11
|
では、上記を踏まえた上で回答に移らせていただきます。
|
|
@@ -19,7 +21,7 @@
|
|
|
19
21
|
// なので、下記に変更
|
|
20
22
|
const newItem = document.createElement('div');
|
|
21
23
|
|
|
22
|
-
//
|
|
24
|
+
// itemを代入し直してないので、下記のようにidを変えたい要素の変数を変更でオーケー
|
|
23
25
|
newItem.id = item;
|
|
24
26
|
results.appendChild(item);
|
|
25
27
|
|
1
idに数値が許可されている（HTML5以降）最新の仕様に基づいた内容に修正
answer
CHANGED
|
@@ -1,9 +1,10 @@
|
|
|
1
|
-
まず第一に、HTMLの仕様におけるidは、**数字のみ**、**頭文字が数字**は許可されておりません。
|
|
1
|
+
~~まず第一に、HTMLの仕様におけるidは、**数字のみ**、**頭文字が数字**は許可されておりません。~~
|
|
2
|
+
上記は、古い情報だったようで、現代（HTML5以降）においては許可されているようです。
|
|
2
3
|
|
|
3
4
|
[[HTML, CSS, JavaScript] id名/class名に使用できる文字の種類 · GitHub](https://gist.github.com/think49/d8fbcf7f1c743e21bc79bb7d16178cad)
|
|
4
5
|
（公式ではないですが、公式の引用があるので、かなり信用できる内容です）
|
|
5
|
-
また、実際に使用しても、CSSがきかない、JSでのコントロールでエラーが起きたりなど、
|
|
6
|
+
~~また、実際に使用しても、~~ただし、CSSがきかない~~、JSでのコントロールでエラーが起きたりなど、~~という弊害がでます。（CSSでコントロールしない限りは大丈夫かと思います）
|
|
6
|
-
（HTMLでid定義した要素は、JavaScript上で、そのid名だけで取得できる→JavaScriptでは数値が頭文字の変数定義は許可されていない、など）
|
|
7
|
+
~~（HTMLでid定義した要素は、JavaScript上で、そのid名だけで取得できる→JavaScriptでは数値が頭文字の変数定義は許可されていない、など）~~
|
|
7
8
|
|
|
8
9
|
では、上記を踏まえた上で回答に移らせていただきます。
|
|
9
10
|
|
|
@@ -19,18 +20,13 @@
|
|
|
19
20
|
const newItem = document.createElement('div');
|
|
20
21
|
|
|
21
22
|
// id名を文字列+数値にする（上記の変更に併せて修正）
|
|
22
|
-
newItem.id =
|
|
23
|
+
newItem.id = item;
|
|
23
24
|
results.appendChild(item);
|
|
24
25
|
|
|
25
26
|
//要素が追加されたか確認
|
|
26
|
-
// itemにはすでに、要素が代入し直されてしまっていたので、取得できるわけがない
|
|
27
|
-
|
|
27
|
+
document.getElementById(item).textContent += "テスト";
|
|
28
|
-
// よって下記に修正
|
|
29
|
-
document.getElementById('res' + item).textContent += "テスト";
|
|
30
|
-
|
|
31
28
|
}
|
|
32
29
|
|
|
33
30
|
//要素が追加されたか確認
|
|
34
|
-
// resの文字列を追加
|
|
35
|
-
document.getElementById('
|
|
31
|
+
document.getElementById('1').textContent += 111;
|
|
36
32
|
```
|