0

Estou desenvolvendo um layout, preciso que seus class no div, sejam aleatorios entre dois nomes, preciso de um javascript para fazer isso, alguém pode me ajudar?

Ex.:

<div class="left"><div>
<div class="right"><div>
<div class="left"><div>
<div class="right"><div>
<div class="left"><div>
<div class="right"><div>

obs.: Lembrando que preciso de uma função para inserir, pois vou utilizar isso no Wordpress...

Obrigado

6
  • Vc está fazendo loop no PHP? Se sim, então é melhor usar o PHP para isso do que JS
    – Sam
    Commented 10/04/2018 às 20:55
  • Sim, em php, pelo wordpress...
    – Nerbado
    Commented 10/04/2018 às 20:57
  • Precisa de JS pra isso não. Faz no próprio PHP
    – Sam
    Commented 10/04/2018 às 20:58
  • Mostre como está fazendo o looping?
    – Sam
    Commented 10/04/2018 às 21:03
  • 2
    Vc quer "aleatório" ou "alternando"?
    – Sam
    Commented 11/04/2018 às 0:03

2 Respostas 2

2

Além da forma da citada, há uma outra forma também que é verificando se um determinado número é par ou ímpar, por exemplo:

PHP:

<?php

for ($i = 0; $i < 10; $i++) {
    /**
     * Caso o número seja par, define a classe como `right`;
     * Caso contrário, define como `left`.
     */
    $class = ($i % 2) ? 'right' : 'left';

    /**
     * Imprime a `div` com a classe e adiciona uma quebra
     * de linha com PHP_EOL
     */
    echo "<div class=\"{$class}\"><div>", PHP_EOL;
}

JavaScript:

const container = document.querySelector("#container");

for (let i = 0; i < 10; i++) {
  container.insertAdjacentHTML('beforeend', `<div class="${i % 2 ? 'right' : 'left'}"><div>`);
}
#container {columns: 2}
.left,.right {height: 50px;width: 50px}
.left {background:red}
.right {background:yellow}
<div id="container"></div>

Para mais informações sobre insertAdjacentHTML

0

Exemplificando com um looping while, que pode ser aplicado a qualquer outro.

Antes do looping defina o valor $i = 'left'; e pode usar <?=$i?> em vez de <?php echo $i ?> se seu servidor estiver configurado para aceitar:

<?php
$i = 'left';
while(condição):
?>
<div class="<?=$i?>">conteúdo da div</div>
<?php
   $i = $i == "left" ? "right" : "left";
endwhile;
?>

Coloque $i = $i == "left" ? "right" : "left"; no final do looping, que irá alternando o valor de $i a cada volta.

3
  • Esse quase deu Certo, esta com o Loop, eu já tenho o loop, precisava apenas da parte para inserir no loop, consegue me ajudar por favor?
    – Nerbado
    Commented 18/04/2018 às 3:25
  • Sim. O que vc precisa?
    – Sam
    Commented 18/04/2018 às 3:26
  • Cara, consegui... muito obrigado... coloquei "$i = $i == "left" ? "right" : "left";" no final do meu loop, e o comando deu certo... Muito obrigado amigo..
    – Nerbado
    Commented 18/04/2018 às 13:12

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 .