6

html ファイル内のいくつかの要素のコピーを構成できる外部 js ファイルを作成したいと考えています。私はdocument.getElementById("id").innerHTML = "what ever";を使用しています。特定のIDを持つhtml要素に私のコピーを「注入」または「追加」します。

これはうまくいきますが、html ファイルに同じ ID の要素が複数ある場合、js ファイルの html は最初の要素にのみ追加されますが、js ファイルの html はすべての要素に追加する必要があります。同じIDで

それが私の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ファイルです:

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

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

どんな助けやヒントも大歓迎です。ありがとう！

4

5 に答える 5

6

ids は 1 回しか使用できないため、class を使用できます。

<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-11T07:07:16.183 に答える
1

js では、次のようにできます。 

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

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

于 2015-07-20T14:28:31.420 に答える
0

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

または、Javascript で要素の配列を提供する関数をname使用することもできます。getElementsByName()

于 2012-04-11T07:01:51.037 に答える
0

あなたはjQueryを持っています$('#back-button').html('go back')。プレーン/ネイティブJSの代わりに使用してみませんか?

ただし、複数のボタンがあり、IDは一意である必要があるため、これに ID を使用することはできません。class="back-button"次の jQuery コードを使用します。

$('.back-button').html('go back');
于 2012-04-11T07:03:43.907 に答える
0

HTML 要素には id の代わりに class を使用し、jquery を使用して必要なテキストを入力してください。

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


$('.back-button').text('go back');   // OR
$('.back-button').html('go back');
于 2012-04-11T07:08:17.203 に答える