回答編集履歴
1
el.outerHTML = el.textContent
test
CHANGED
|
@@ -26,6 +26,21 @@
|
|
|
26
26
|
document.querySelectorAll('.hide').forEach(el => el.classList.remove('hide'));
|
|
27
27
|
```
|
|
28
28
|
|
|
29
|
+
本題とは関係ありませんが、`el.outerHTML = el.textContent` は、textContent値にHTMLタグが含まれていた場合、コード実行後に元のテキストノード値を復元できない問題があります。
|
|
30
|
+
|
|
31
|
+
```html
|
|
32
|
+
<span id="test"><strong>foo</strong></span>
|
|
33
|
+
<script>
|
|
34
|
+
'use strict';
|
|
35
|
+
const span = document.getElementById('test');
|
|
36
|
+
span.outerHTML = span.textContent;
|
|
37
|
+
</script>
|
|
38
|
+
```
|
|
39
|
+
|
|
40
|
+
この問題は、`replaceChild` で要素ノードからテキストノードに置換するコードに変更する事で修正できます。
|
|
41
|
+
|
|
42
|
+
- [Node\.replaceChild \- Web API \| MDN](https://developer.mozilla.org/ja/docs/Web/API/Node/replaceChild)
|
|
43
|
+
|
|
29
44
|
### 再現可能な短いサンプルコード
|
|
30
45
|
|
|
31
46
|
本回答で解決できなかったとして、まずはfukuさん自身で「現象を再現可能な最小限のコード」を作成する事から始めることをお勧めします。
|