いくつかのJavaScriptを使用した単純なHTMLコードがあります。
<html>
<head>
<script type="text/javascript">
function changeDivContent() { // ...
};
</script>
</head>
<body>
<input type="radio" name="radiobutton" value="A" onClick="changeDivContent()">
<input type="radio" name="radiobutton" value="B" onClick="changeDivContent()">
<div id="content"></div>
</body>
</html>「A」または「B」のいずれかのラジオボタンを選択してdivのコンテンツ（内部のhtml）を変更できるようにしたいのですが、div＃contentにはJavaScript属性の「値」がないため、どのようにできるかを尋ねています終わり。
回答:
この種のことをより簡単にするjQueryまたは他のライブラリーを使用していないと想定すると、要素のinnerHTMLプロパティを使用するだけで済みます。
document.getElementById("content").innerHTML = "whatever";innerHTMLではなく、innerTextかつtextContentので、innerHTMLすべてのブラウザに対応しています。
innerHTML、値が信頼できない入力からのものである場合、XSS脆弱性に簡単につながる可能性があります。の使用はinnerTextセキュリティ上の理由から常に推奨されており、現在すべてのブラウザ（caniuse.com/#feat=innertext）でサポートされています
div変更するコンテンツのIDを取得し、次のようにテキストを割り当てます。
var myDiv = document.getElementById("divId");
myDiv.innerHTML = "Content To Show";次のヘルパー関数を使用できます。
function content(divSelector, value) {
document.querySelector(divSelector).innerHTML = value;
}
content('#content',"whatever");#content有効なCSSセレクターが必要な場所
こちらが動作例です。
追加-今日（2018.07.01）jqueryと純粋なjsソリューション（MacOs High Sierra 10.13.3 on Chrome 67.0.3396.99（64-bit）、Safari 11.0.3（13604.5.6）、Firefox 59.0.2）の速度比較を行いました（64ビット））：
document.getElementById("content").innerHTML = "whatever"; // pure JS
$('#content').html('whatever'); // jQuery
jqueryソリューションは、純粋なjsソリューションよりも低速でした：69％がFirefox、61％がSafari、56％がChrome。純粋なjsの最速のブラウザは、毎秒560Mの操作を行うFirefoxで、2番目はSafari 426Mで、最も遅いのはChrome 122Mでした。
つまり、勝者は純粋なjsとfirefoxです（クロムより3倍高速です！）
あなたはあなたのマシンでそれをテストすることができます：https：//jsperf.com/js-jquery-html-content-change
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
</head>
<body>
<input type="radio" name="radiobutton" value="A" onclick = "populateData(event)">
<input type="radio" name="radiobutton" value="B" onclick = "populateData(event)">
<div id="content"></div>
</body>
</html>----------------- JS-コード------------
var targetDiv = document.getElementById('content');
var htmlContent = '';
function populateData(event){
switch(event.target.value){
case 'A':{
htmlContent = 'Content for A';
break;
}
case 'B':{
htmlContent = "content for B";
break;
}
}
targetDiv.innerHTML = htmlContent;
}Step1: on click of the radio button it calls function populate data, with event (an object that has event details such as name of the element, value etc..);
Step2: I extracted the value through event.target.value and then simple switch will give me freedom to add custom text.ライブコード
onClickに変更しonClick="changeDivContent(this)"て試してください
function changeDivContent(btn) {
content.innerHTML = btn.value
}
document.getElementById("content").innerText = "<b>bold text?</b>";に、時には非常に有益異なる振る舞い、となりますdocument.getElementById("content").innerHTML = "<b>bold text?</b>";