Como ordenar div [JavaScript]

1. Como ordenar div

Enviado em 04/05/2017 - 07:56h

Pessoal, preciso de uma ajuda urgente. Sou bastante leigo no programação, por isso que estou tirando minhas dúvidas com quem entende.
Não estou conseguindo ordenar minhas divs feitas em HTML5.
Tenho a seguinte situação básica:

<!doctype html>
<html>
<head>
</head>

<body>
<div>
<div> 10 </div>
<div> 2 </div>
<div> 1 </div>
<div> 20 </div>
<div> 3 </div>
</div>
</body>
</html>

Agora não sei como ordená-las em ordem crescente ou decrescente automaticamente. Se alguém puder me ajudar agradeço.

2. Re: Como ordenar div

Enviado em 04/05/2017 - 10:34h

Adriano_Alves escreveu:
Agora não sei como ordená-las em ordem crescente ou decrescente automaticamente. Se alguém puder me ajudar agradeço.

fiquei meio que boiando no q realmente vc quer .. v se é isso ...
http://www.devmedia.com.br/css-z-index-entendendo-sobre-o-eixo-z-na-web/28698
_______________________________________________________________
" Nem sempre é amigo aquele que te tira do buraco !!! ( Saddam Hussein )"

3. Re: Como ordenar div

Enviado em 04/05/2017 - 18:06h

Adriano_Alves escreveu:

Pessoal, preciso de uma ajuda urgente. Sou bastante leigo no programação, por isso que estou tirando minhas dúvidas com quem entende.
Não estou conseguindo ordenar minhas divs feitas em HTML5.
Tenho a seguinte situação básica:

<!doctype html>
<html>
<head>
</head>

<body>
<div>
<div> 10 </div>
<div> 2 </div>
<div> 1 </div>
<div> 20 </div>
<div> 3 </div>
</div>
</body>
</html>

Agora não sei como ordená-las em ordem crescente ou decrescente automaticamente. Se alguém puder me ajudar agradeço.

Sinceramente, desconheço uma maneira de "pegar" esses valores e ordena-los . . . .
Pois vc nem ao menos referenciou os elementos . . . .
tipo:
<div>
<p id="p01">10</p>
</div>
.
.
.
Dessa forma, com o js, voce consegue pegar o conteúdo dos elementos, jogar numa ARRAY e ordena-los . . .
Aprendi mto em:

https://www.w3schools.com/js/default.asp

Att.:
marcelo oliver

4. Re: Como ordenar div

Enviado em 04/05/2017 - 22:28h

Então, eu escrevi o código bem simples, só para entender o que eu preciso, mas vou escrever o código mais completo aqui.



<!doctype html>

<html>

<head>

<meta charset="utf-8">

<title>Ordenar números em ordem crescente</title>

	<style>

		table#tab {

			border: 1px solid #000000;

			border-spacing: 0px;

		}

		td {

			border: 1px solid #000000;

			padding: 30px 40px 30px 40px;

			text-align: center;

		}

	</style>

</head>



<body>



	<table id="tab">

		<tr><td id="l1" class="c1">15</td></tr>

		<tr><td id="l2" class="c2">4</td></tr>

		<tr><td id="l3" class="c3">5</td></tr>

		<tr><td id="l4" class="c4">32</td></tr>

		<tr><td id="l5" class="c5">1</td></tr>

		<tr><td id="l6" class="c6">43</td></tr>

	</table>



</body>

</html>

Só quero entender como faço para ordenar esses números em ordem crescente, colocar o número "1" no primeiro quadro, o número "4" no segundo, o "5" no terceiro, assim por diante, tudo de forma automática, quero que coloca em ordem conforme o valor de cada quadro, não se é PHP ou Javascript, porque ainda estou estudando programação devido a necessidade no trabalho. Se puder me ajudar agradeço.

5. Re: Como ordenar div

Enviado em 04/05/2017 - 22:51h

https://pt.stackoverflow.com/questions/46368/como-ordenar-tr%C3%AAs-divs-de-acordo-com-um-atributo-d...

6. Re: Como ordenar div

Enviado em 04/05/2017 - 22:57h

Por que você não põe 'id' nas 'div' e depois avalia o conteúdo delas?
Daí você usa isto para ordenar como em um índice.

----------------------------------------------------------------------------------------------------------------
Nem direita, nem esquerda. Quando se trata de corrupção o Brasil é ambidestro.
(anônimo)

Encryption works. Properly implemented strong crypto systems are one of the few things that you can rely on. Unfortunately, endpoint security is so terrifically weak that NSA can frequently find ways around it. — Edward Snowden

7. Como ordenar div [Resolvido]

Enviado em 07/05/2017 - 15:40h

Quero agradecer a todos que responderam, com muito sacrificio consegui dessa forma ordenar divs:



<doctype html>

<html>

<head>

     <style>

           .cdiv {

			padding: 10px;

			box-shadow: 1px 1px 2px rgba(0,0,0,.3);

			width: 150px;

			height: 84px;

			margin: 10px;

			border: rgba(0,0,0,.5) 1px solid;

		}

    </style>

<head>

<body>

<?php

        $n1 = 340;

	$n2 = 33;

	$n3 = 2; 

	$n4 = 65;

	$n5 = 1;

	

	$v = array ("<div class='cdiv'>$n1</div>",

			"<div class='cdiv'>$n2</div>",

            	        "<div class='cdiv'>$n3</div>",

            	        "<div class='cdiv'>$n4</div>",

            	        "<div class='cdiv'>$n5</div>");



	natcasesort($v);

	foreach($v as $valor){

		echo "$valor";

	}

?>

</body>

</html>

Como ordenar div

Responder tópico