JavaScript - Filtro Javascript

 
Vista:

Filtro Javascript

Publicado por Diego Bernal (12 intervenciones) el 04/09/2022 17:56:42
Buen día, tengo un ejercicio en el que tengo el siguiente siguiente codigo en js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
const url = 'https://jsonplaceholder.typicode.com/todos';
 
fetch(url)
    .then(response => response.json())
    .then(data => {
        console.log(data);
        data.forEach(element => {
            let traer = document.getElementById("go")
            const line = document.createElement('p')
            line.setAttribute("id", element.completed)
            line.innerHTML = element.completed
            traer.appendChild(p)
        });
    })
Por el momento he hecho que de la pagina https://jsonplaceholder.typicode.com/todos me traiga todos los datos de true y false en html en "go" que es un div y creando parrafos pero lo que solicita que es primero muestre los true y con css se muestren en un lado y luego los false al otro lado, no se como hacer un filtro para que solo me llame los true y después llamar los false
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
sin imagen de perfil

Filtro Javascript

Publicado por antonio (16 intervenciones) el 05/09/2022 10:01:34
Hola Prueba este código aunque a mi si me funciono, solo tienes que tener un div para la derecha y otro para la izquierda y dependiendo de si es false o true el completed pues lo escribes en uno u otro :
https://escueladepostgrados.000webhostapp.com/prueba.php

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<style>
 #izquierda{
 
width: 50%;
float:left;
}
 #derecha{
 
width: 50%;
float:right;
}
</style>
<script>
const url = 'https://jsonplaceholder.typicode.com/todos';
 
fetch(url)
    .then(response => response.json())
    .then(data => {
        console.log(data);
        data.forEach(element => {
            let traer = document.getElementById("go")
            const line = document.createElement('p')
            line.setAttribute("id", element.completed)
            if(element.completed==false){
                var text = document.createTextNode(" "+element.userId+", "+element.id+", "+element.title+", "+element.completed+" ");
            document.getElementById('izquierda').appendChild(text);
            document.getElementById('izquierda').appendChild(document.createElement("br"));
 
 
            }
            else{
                var text = document.createTextNode(" "+element.userId+", "+element.id+", "+element.title+", "+element.completed+" ");
              document.getElementById('derecha').appendChild(text);
              document.getElementById('derecha').appendChild(document.createElement("br"));
            }
        });
    })
</script>
</head>
<body>
<div id = "go">
<div id='izquierda'>
    </div>
<div id='derecha'>
    </div>
</div>
</body>
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar

Filtro Javascript

Publicado por Diego Bernal (12 intervenciones) el 06/09/2022 15:13:13
Si funciono, muchas gracias.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar