document.getElementById.innerHTMLは一度だけ動作します。グローバルコピー要素の設定方法は？

外部のjsファイルを作成したいのですが、htmlファイルにいくつかの要素のコピーを設定できます。私はdocument.getElementById（ "id"）を使用しています。innerHTML = "これまで";は特定のidを持つhtml要素に自分のコピーを "挿入"または "追加"します。document.getElementById.innerHTMLは一度だけ動作します。グローバルコピー要素の設定方法は？

これはうまくいきますが、htmlファイル内の同じIDを持つ複数の要素がある場合、jsファイルのhtmlは最初の要素にのみ追加されますしかし、jsファイルのhtmlは

<html> <head> <script src="copy.js" type="text/javascript" charset="utf-8"></script> <script src="jquery.js" type="text/javascript" charset="utf-8"></script> </head> <body> <div> <strong id="back-button"></strong> </div> .... <div> <strong id="back-button"></strong> </div> </body> </html>

は
そして、それは私のJSファイルです：私のHTML構文だ同じid

を持つすべての要素に追加することが

$(function() { 
    $(document).ready(function addcopy() { 

     /* global */ 
     document.getElementById("back-button").innerHTML = "go back"; 
}); 
});

ご迷惑をおかけして申し訳ございません。ありがとう！

出典

2012-04-11 Dominic

idのは一度だけ使用することができますので、あなたは、クラスを使用することができます。

<html> 
<head> 
<script src="copy.js" type="text/javascript" charset="utf-8"></script> 
<script src="jquery.js" type="text/javascript" charset="utf-8"></script> 
</head> 
<body> 
<div class="back-button"> 
</div> 
.... 
<div class="back-button"> 
</div> 
</body> 
</html>

とJavaScriptで：

<script type="text/javascript"> 
    $(document).ready(function addcopy() { 
     /* global */ 
     $(".back-button").html("<strong>go back</strong>"); 
    }); 
</script>

出典

2012-04-11 07:07:16 tusar

恐ろしい！迅速なヘルプありがとう - これは完璧に働いている！ – Dominic

それがあなたを助けてくれてうれしいです。ところで、あなたはまた、すべての有用な答えを投票する必要があります。それらのすべてが正しいです。 – tusar

@ tusarシステムは彼にまだupvoteをさせません –

id属性が一意である必要があります.JQueryで複数のセレクタを使用する場合は、代わりにclassを使用できます。

また、nameとgetElementsByName()関数を使用すると、Javascriptで要素の配列を取得できます。

出典

2012-04-11 07:01:51

恐ろしい！迅速な助けをありがとう！あなたの提案とうまく動作します！ – Dominic

あなたはjQueryを持っていますが、plain/native JSの代わりに$('#back-button').html('go back')を使用してみませんか？

あなたは、このためのIDを使用することはできませんので、しかし、あなたはボタン一つ以上のものを持っているとのID は、一意である必要があります。 class="back-button"と、次のjQueryコードを使用します。

$('.back-button').html('go back');

出典

2012-04-11 07:03:43 ThiefMaster

はい、[理由]（http://jsperf.com/jquery-id-vs-getelementbyid-id）[not]（http://jsperf.com/innerhtml-vs-jquery-html-insert/3）確かに。 –

パーフェクト！迅速なヘルプありがとう - あなたはそうです - それは完全にそのように働いています！ – Dominic

必要なテキストを埋めるためにHTML要素と使用jqueryのためにクラスの代わりにIDを使用してください。 JSで

<div> 
<strong class="back-button"></strong> 
</div> 


$('.back-button').text('go back'); // OR 
$('.back-button').html('go back');

出典

2012-04-11 07:08:17

驚くばかり！迅速な助けをありがとう!!!あなたの提案とうまく動作！ – Dominic

は、あなたがこのようにそれを行うことができます。

document.getElementsByClassName('message')[0].innerHTML = "Good afternoon:)!";

次にできるのは、このクラスのすべての要素をループ。

出典

2015-07-20 14:28:31

document.getElementById.innerHTMLは一度だけ動作します。グローバルコピー要素の設定方法は？

答えて

関連する問題