Question

我有这个HTML代码：

<div id="dadosalvaje" class="draconistone"><dl class="codebox"><dd><strong>Número aleatorio (1,10) : </strong>1</dd></dl></div>

<div id="dadosalvaje" class="draconistone"><dl class="codebox"><dd><strong>Número aleatorio (1,10) : </strong>3</dd></dl></div>

我想在每个代码上执行此JavaScript代码：

$(document).ready(function() {
    //Arreglos
    var zonas = ['draconistone','cessabit', 'valoran'];
    var draconistone = ['bulbasaur', 'pikachu', 'squirtle'];

    //Variables
    var contenedor = $('#dadosalvaje');
    var texto = contenedor.text().split(' ');
    var resultado = texto.pop();
    var zonaID = $('#dadosalvaje').attr('class');

    for (var i = 0; i < zonas.length; i++) {
        if (zonaID == zonas[i]) {
            if (zonaID == 'draconistone') {
                var pokemonSprite = draconistone[resultado - 1];
            }
        }
    }

    for (var i = 0; i < zonas.length; i++) {
        if (zonas[i] == zonaID) {
            contenedor.append('<img src="https://www.pkparaiso.com/imagenes/xy/sprites/animados/' + pokemonSprite + '.gif"><div class="salvajeNombre">' + pokemonSprite + '</div>');
            contenedor.attr('id', 'salvajelisto');
        }
    }
});

它只影响第一个元素，我找不到修改它们的方法。

有没有办法修改具有相同ID的每个元素？

Answer 1

也许你可以使用$ .each（）喜欢这个

$('.draconistone').each(function() {
  var zonaID = $(this).attr('class');
  ..
});

Answer 2

同一个班级有一个

＆＃13;

$( document).ready(function() {
  $( ".draconistone" ).each(function( i ) {
     var zonas = ['draconistone','cessabit', 'valoran'];
    var draconistone = ['bulbasaur', 'pikachu', 'squirtle'];

    //Variables
    var texto = this.innerText.split(' ');
    var resultado = texto.pop();
    var zonaID = this.className;
    
    for (var i = 0; i < zonas.length; i++) {
        if (zonaID == zonas[i]) {
            if (zonaID == 'draconistone') {
                var pokemonSprite = draconistone[resultado - 1];
            }
        }
    }

    for (var i = 0; i < zonas.length; i++) {
        if (zonas[i] == zonaID) {
            this.innerHTML += '<img src="https://www.pkparaiso.com/imagenes/xy/sprites/animados/' + pokemonSprite + '.gif"><div class="salvajeNombre">' + pokemonSprite + '</div>';
            this.id = 'salvajelisto';
        }
    }
  });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="dadosalvaje1" class="draconistone"><dl class="codebox"><dd><strong>Número aleatorio (1,10) : </strong>1</dd></dl></div>

<div id="dadosalvaje2" class="draconistone"><dl class="codebox"><dd><strong>Número aleatorio (1,10) : </strong>3</dd></dl></div>

＆＃13;

Answer 3

首先，您需要创建唯一ID
您不需要“draconistone”类

$（document）.ready（function（）{and}）;标签使代码成为具有id参数的函数，如下所示：

function name(id) {
    //Arreglos
    var zonas = ['draconistone','cessabit', 'valoran'];
    var draconistone = ['bulbasaur', 'pikachu', 'squirtle'];
    //Variables
    var contenedor = $('#' + id);
    var texto = contenedor.text().split(' ');
    var resultado = texto.pop();
    var zonaID = $('#' + id).attr('class');

    for (var i = 0; i < zonas.length; i++) {
        if (zonaID == zonas[i]) {
            if (zonaID == 'draconistone') {
                var pokemonSprite = draconistone[resultado - 1];
            }
        }
    }

    for (var i = 0; i < zonas.length; i++) {
        if (zonas[i] == zonaID) {
            contenedor.append('<img src="https://www.pkparaiso.com/imagenes/xy/sprites/animados/' + pokemonSprite + '.gif"><div class="salvajeNombre">' + pokemonSprite + '</div>');
            contenedor.attr('id', 'salvajelisto');
        }
    }
}

然后用两个不同的id作为参数执行函数。

对每个元素执行函数（具有相同的id）

3 个答案: