要素のinnerHTMLを設定中にメソッドを呼び出す

Question

innerHTMLの設定中にメソッドを呼び出すのに苦労しています。 私は見落としてしまった簡単な答えがある場合はお詫びしますが、現時点では私は立ち往生しています。

Seを以下のコード：

"<a href='#' onclick='removeEntry('" + element.id + "')'><span class='fa fa-times'></span></a>" 

あなたが引用符に関する混乱があることを確認することができます。 "removeEntry（element.id）"を呼び出すことができる種類の引用符などを入力する3番目の方法はありますか？ removeEntryを呼び出すには、element.idの前後に引用符が必要です。どのようにこれを別の方法で解決するための提案？あなたが実際に

"<a href='#' onclick='removeEntry(\"" + element.id + "\")'><span class='fa fa-times'></span></a>"

で

"<a href='#' onclick='removeEntry('" + element.id + "')'><span class='fa fa-times'></span></a>"

を交換する必要があり

Answer 1

は、問題がaタグonclickプロパティはonclick='removeEntry('myId')'

のように見えることでしょう、あなたと一緒に現在のコードです

注釈があります簡単な引用符で囲んで、あなたの関数呼び出しを破ってください。エスケープされた二重引用符でid簡単な引用符を交換し、そしてそれは:)

編集あなたは大丈夫ですonclick='removeEntry("myId")'をあげる：あなたは、最近のブラウザをターゲットにしている場合とにかく、あなたはそれはあなたを与えるだろう、ES6 template literalsを試みることができます次の行は：

var html = `<a href="#" onclick="removeEntry('${element.id}')"><span class="fa fa-times"></span></a>`;

これはあなたの引用符で苦労を避けるために役立ちます。テンプレートリテラルに含まれる変数はPHPのように見えることに注意してください。

Answer 2

'<a href="#" onclick="removeEntry(' + element.id + ')"> 
    <span class="fa fa-times"></span> 
</a>' 

これはうまくいくはずです。 二重引用符を一重引用符でエンコードすることができます。この完全な式をstring.soにするには、変数付きの文字列を と書くことができます。string1 = string2 + variable + string3;

JavaScriptの複数行文字列の場合は、バックティックを使用できます。

`<a href="#" onclick="removeEntry(' + element.id + ')"> 
     <span class="fa fa-times"></span> 
</a>` 

Answer 3

この：正しくない

<a href='#' onclick='removeEntry('someId')'><span class='fa fa-times'></span></a> 

：

"<a href='#' onclick='removeEntry('" + element.id + "')'><span class='fa fa-times'></span></a>" 

は、このような要素を作成します。何をする必要があるのいずれかのことです。

1. が他の引用符を使用し"（しかし、あなたがそれらをエスケープする必要がある）：このよう

：

"<a href='#' onclick='removeEntry(\"" + element.id + "\")'><span class='fa fa-times'></span></a>" 

を作成しますこのような要素：

<a href='#' onclick='removeEntry("someId")'><span class='fa fa-times'></span></a> 

2. それとも'引用符（あなたにもバックスラッシュをエスケープする必要がある）にバックスラッシュ\を追加します。
   ：このような要素を作成するために

   "<a href='#' onclick='removeEntry(\\'" + element.id + "\\')'><span class='fa fa-times'></span></a>" 
   

   ：このよう

<a href='#' onclick='removeEntry(\'someId\')'><span class='fa fa-times'></span></a>