How to print results of a filter outside of Console?

user11804298 0
Viewed 28

I want to make an Android application using only javascript and HTML. That works without the need for internet. It's a kind of dictionary that looks for words by name or category. I was able to apply the filter correctly. The problem I have is that the result is only given to me by the console and thus it does not work for an android application (for the phone).

I need the result of this filtering to be printed by a document.write or to be able to get it out of the script and print it in HTML , tag for example. The question is: The results of a script how to print it in HTML? How can I print with document.write the results of a filter? Does anyone know the method to do it?

I'm learning now, I would appreciate understanding and help... Thank you...

<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA- 
Compatible" content="IE=edge">
<meta name="viewport" 
content="width=device-width, 
initial-scale=1.0">
<title>Document</title>
</head>

<body>
<script>
    const palabras = [{
        nombre: "alex",
        categoria: "verbo",
        traducion: "yupi"
    }, {
        nombre: "yoyo",
        categoria: "sustantivo",
        traducion: "wao"
    }, {
        nombre: "alexis",
        categoria: "verbo",
        traducion: "yupi"
    }, {
        nombre: "yoyolo",
        categoria: "sustantivo",
        traducion: "wao"
    }, ]
    const resultado = 
 palabras.filter(palabra => 
 palabra.categoria == 
"sustantivo")
        
    console.log(resultado)
</script>
</body>

</html>

filter arrays javascript
1 Answers

Simply use element.insertAdjacentHTML(). It is easier to use than .append() as you can insert HTML markup directly into an existing DOM element without having to create a child DOM element first (with document.createElement()). It is also not as disruptive to the already existing page contents as .innerHTML+= ... would be.

<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA- 
Compatible" content="IE=edge">
<meta name="viewport" 
content="width=device-width, 
initial-scale=1.0">
<title>Document</title>
</head>

<body>
<script>
    const palabras = [{
        nombre: "alex",
        categoria: "verbo",
        traducion: "yupi"
    }, {
        nombre: "yoyo",
        categoria: "sustantivo",
        traducion: "wao"
    }, {
        nombre: "alexis",
        categoria: "verbo",
        traducion: "yupi"
    }, {
        nombre: "yoyolo",
        categoria: "sustantivo",
        traducion: "wao"
    }, ]
    const resultado = 
 palabras.filter(palabra => 
 palabra.categoria == 
"sustantivo")
        
    console.log(resultado)
    document.body.insertAdjacentHTML("beforeend",JSON.stringify(resultado))
</script>
</body>

</html>

Carsten Massmann0
Related