0

Como alterar esse código javascript para exibir a div-Content antes do H2, em vez de após, como está atualmente?

<script type='text/javascript'>
function insertAfter(addition,target) {
    var parent = target.parentNode;
    if (parent.lastChild == target) {
        parent.appendChild(addition); 
    } else {
        parent.insertBefore(addition,target.nextSibling);
    }
}
var adscont = document.getElementById("div-content");
var target = document.getElementById("div-target");
var linebreak = target.getElementsByTagName("h2");
if (linebreak.length > 0){
    insertAfter(adscont,linebreak[8]);
}
</script>
0

1 Resposta 1

0

Na linha parent.insertBefore(addition,target.nextSibling);, troque o:

target.nextSibling

por apenas:

target

Ficando assim:

parent.insertBefore(addition,target);

O valor do target recebido na função já é o próprio elemento enviado por linebreak[8], onde linebreak é a coleção dos <h2> e [8] é o 9º item da coleção.

No exemplo abaixo coloquei um temporizador apenas para ilustrar (basta apagar todas as linhas comentadas):

function insertAfter(addition,target) {
   var parent = target.parentNode;
   if (parent.lastChild == target) {
      parent.appendChild(addition); 
   } else {
      var conta = 2; // linha exemplo
      var tempo = setInterval(function(){ // linha exemplo
         if(conta > 0 ){ // linha exemplo
            addition.textContent = "div-content. Aguarde "+conta+" segundos"; // linha exemplo
         }else{ // linha exemplo
            addition.textContent = "div-content"; // linha exemplo
            clearInterval(tempo); // linha exemplo
            parent.insertBefore(addition,target);
         } // linha exemplo
         conta--; // linha exemplo
      }, 1000); // linha exemplo
   }
}

var adscont = document.getElementById("div-content");
var target = document.getElementById("div-target");
var linebreak = target.getElementsByTagName("h2");
if (linebreak.length > 0){
   insertAfter(adscont,linebreak[8]);
}
#div-target{
    background: yellow;
}
<div id="div-content">div-content. Aguarde 3 segundos</div>
<div id="div-target">
   <h2>H20</h2>
   <h2>H21</h2>
   <h2>H22</h2>
   <h2>H23</h2>
   <h2>H24</h2>
   <h2>H25</h2>
   <h2>H26</h2>
   <h2>H27</h2>
   <h2>H28</h2>
   <h1>H1</h1>
</div>

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .