cómo agregar id a la etiqueta previa desde el elemento li más cercano con javascript

Question

Quiero agregar una ID a una etiqueta pre desde la etiqueta más cercana li en la que se encuentra la etiqueta pre:

Entonces esto es lo que tengo ahora:

<li id="12345">
   <pre class="code">
      <!-- some code goes here -->
   </pre>
</li>

Y debería convertirse en esto:

<li id="12345">
   <pre class="code" id="12345">
      <!-- some code goes here -->
   </pre>
</li>

javascript jquery dom

-1

nuet 11 dic. 2015 a las 15:12

Answer 1

Solución con data-id en lugar de id:

$('pre').each(function(){
    $(this).attr('data-id', $(this).closest('li').attr('id'));
});

1

Gene R 11 dic. 2015 a las 12:26

Answer 2

Pruebe esto :

 $(document).ready(function(){
        $('li').each(function(i)
        {
           var id = $(this).attr('id');
           $(this).find('pre').data('id',id);//for data-id
           $(this).find('pre').attr('id',id);//for id
        });
    });

0

Ajay Makwana 11 dic. 2015 a las 12:22

Answer 3

La identificación de los elementos debe ser única en el dom. Intente agregar alguna cadena para que sea única como esta:

$(document).ready(function(){
    $('li').find('pre').attr('id', function(d){  return $(this).parent().attr('id')+'_pre';  });
});

0

Sanjay Kumar N S 11 dic. 2015 a las 12:19

Answer 4

Puedes probar algo como esto:

(function() {
  var test = document.getElementById("test");
  var pre = test.getElementsByTagName("pre")[0];
  pre.id = "pre_" + test.id;
  console.log(pre)
})()

<div id="test">
  <ul>
    <li>
      <pre>Test Pre</pre>
    </li>
  </ul>
</div>

0

Rajesh 11 dic. 2015 a las 12:21

Answer 5

En primer lugar, los id son claves únicas y no se pueden repetir. Es mejor que agregue Class no id.

Sin embargo, para responder a su pregunta, pruebe el siguiente código.

var x = document.getElementsByTagName('pre'); 
var y = x.parent;
x.setAttribute("id", y.id);

0

Sumit Sahay 11 dic. 2015 a las 12:22

cómo agregar id a la etiqueta previa desde el elemento li más cercano con javascript

5 respuestas

Preguntas relacionadas

Nuevas preguntas

javascript