文字列内の文字列を文字列内で渡すにはどうすればよいですか？

Question

文字列パラメータが必要なjavascriptのplayAudio（）関数があります。私は文字列の値をこの関数のパラメータとして渡す方法を理解できないようです。

htmlString = "<button class='button-icon' value='PLAY' onclick='playAudio()'></button>"; 

"SP00005"という文字列をパラメータとして渡したいとします。しかし、私は逆のカンマやアポストロフィを使用することができません。これはすでにhtmlStringの外側の部分に使用されています。

私も次に示すように様々なステップにhtmlStringの形成を解体しようとした：

htmlString = ""; 
htmlString += "<button class='button-icon' value='PLAY' onclick='playAudio("; 
htmlString += "SP00005"; 
htmlString += ")'></button>"; 

だから、あなたに私の質問は：どのように私は、それ自体が文字列である文字列内の文字列を渡すのですか？

Answer 1

1つの方法は、"をエスケープすることです。あなたはまた戻って使用することができます

document.getElementById('fooBtn').addEventListener('click', function() { 
    playAudio("SP00005"); 
}); 

Answer 2

あなたは "に解決\"'

例テスト= "Hello, I am \"Steve\""

で：こんにちは、私は "逃げることができるスティーブはplayAudio内部"

Answer 3

あなたは\を使用して、この方法を実行する必要があります" （）：

htmlString = ""; 
htmlString += "<button class='button-icon' value='PLAY' onclick='playAudio(\""; 
htmlString += "SP00005"; 
htmlString += "\")'></button>"; 

Answer 4

：

htmlString = "<button class='button-icon' value='PLAY' onclick='playAudio(\"foo\")'></button>"; 

より良いオプションは、JavaScriptでボタンを選択したEventListenerを追加し、インラインJS

<button id="fooBtn" class='button-icon' value='PLAY'></button> 

jsファイルについては気にしないことですダニ。これは、 "onclickの= 'playAudio（\ <ボタンクラス= 'ボタンアイコン' の値= 'PLAY'" よりエスケープ文字

var string = `<button class='button-icon' value='PLAY' onclick='playAudio('SP00005')'></button>`; 

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals