回答受付が終了しました

jqueryで書いていたものをjsで書き直したかったのですが、タグもそのまま文字列で出力されてしまいます。 何が足りないのか教えてください。 ・jquery

回答(2件)

0

>jqueryで書いていたものをjsで書き直したかったのですが、タグもそのまま文字列で出力されてしまいます。 >何が足りないのか教えてください。 Element.append() https://developer.mozilla.org/ja/docs/Web/API/Element/append ↑ザックリと説明するとElement.append()では文字列はDOMStringになる(つまり文字のまま)。 新規HTMLファイルを作成し、完全コピペで動作を確認して下さい。 https://ideone.com/LXtn4H 問題点としては、これはES6コードなので、クロスブラウザに対応したい場合はBabelなどでES5にコンパイルが必要になる(プロを目指すなら必須)。

蛇足ですが CSS3もクロスブラウザに対応したい場合は、ベンダー・プレフィックスを付与しなければならない(プロを目指すなら必須)。 CSSプロパティのvalue名が違う場合も有り、人力では無理なので、ベンダー・プレフィックス用のツールが必要。

0

sab********さん >・・・・jqueryで書いていたものをjsで書き直した・・・・・・・ ご参考に↓ <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> </head> <body> <div class='js-ibunaisi'>この後に表示</div> <script> /* $(function () { const $targetElement = $('.js-ibunaisi'); const HtmlDoc = ` <h3>xxxxx</h3> <p>xxxxxxx</p> `; $targetElement.append( HtmlDoc ); }); */ const targetElement = document.querySelector('.js-ibunaisi'); var h3 = document.createElement('h3'); h3.innerText = "xxxx" ; targetElement.appendChild(h3); var p = document.createElement('p'); p.innerText = "xxxxxxx" ; targetElement.appendChild(p); </script> </body> </html>