JavaScriptでHTMLコードを挿入するには？

-2

JavaScriptを使用してビューにHTMLオブジェクトを配置しようとしています。これは可能ですか？私は次のようなものを探しています：JavaScriptでHTMLコードを挿入するには？

<script> 
<% for @m in @messages %> 
    <h1>i</h1> 
<% end %> 
</script>

私がする必要があるのは、Rubyと一緒に行くことです。これが可能かどうかわからない。

出典

2017-08-24 Collin

HTMLは「実行」しません。「コード」ではなく、単なるマークアップです。ブラウザがそれを解釈します。心に留めておきます。 JavaScriptが実際に実行されます。 – tadman

を呼び出すことになります。

var cars = ["car", "car", "car"]; 

for (i = 0; i < cars.length; i++) { 
    var h1 = document.createElement('h1'); 
    h1.innerHTML = i; 
    document.body.appendChild(h1); 
}

これはあなたの中の要素を追加したいと仮定し<body>。

JSFiddle：https://jsfiddle.net/zh0wc0zL/2/

出典

2017-08-24 00:21:22 heyitsjhu

-1

何をしたいのJSに直接新しいDOMノードを作成することです、はい、あなたはそれを行うことができます。あなたは実際にHTMLを使ってそれを行うことができ、必要なノードに解析されます。

あなたは、ページがロードされるようにそれを行う必要がある場合、これはスクリプトが置かれたbodyに位置にノードを配置します：

<script> 
 
    var cars = ["Honda", "Toyota", "Volkswagen"]; 
 
    for (var i = 0; i < cars.length; i++) { 
 
    document.write(`<h1>${i}: ${cars[i]}</h1>`); 
 
    } 
 
</script>

注意してくださいはdocument.writeがほとんど使用されず、がロードされている間にはしか動作しません。初心者はこれに頻繁に立ち往生します。

これは、ページが読み込まれた後に実行する必要がある場合は、別の方法で行います。

var myButton = document.getElementById("button"); myButton.addEventListener("click", function(event) { var container = document.getElementById("container"); var cars = ["Honda", "Toyota", "Volkswagen"]; for (var i = 0; i < cars.length; i++) { container.insertAdjacentHTML("beforeend", `<h1>${i}: ${cars[i]}</h1>`); } }, false);

<button id="button">CLICK ME</button> <div id="container"></div>

これは、新しい要素を取得する必要がありますID "container"とのID "button"としてページ上の要素があります前提としています。

出典

2017-08-24 00:22:03 spanky

これまでに行ってきましたが、JavaScriptを使用して値を作成することはできません。なぜなら、Rubyもいくつか含まれているからです。 – Collin

@Collin：あなたの質問にどのように関係するか分かりません。 – spanky

私の質問が更新されました。混乱させて申し訳ありません。 – Collin

-1

これを試すことができます。 HTML：

<body> 
    <h1 id = 'example'></hi> 
</body

Javascriptを：のdocument.getElementById（ '例'）innerHTMLプロパティ（ 'あなたが好きなテキスト'）;。

出典

2017-08-24 00:22:41

JavaScriptでHTMLコードを挿入するには？

関連する問題