Why doesn’t my code make anything appear on the page?

Asked

Viewed 40 times

0

I was trying to make an html page using javascript, but nothing happens, I put the script inside the body, Linkei the bootstrap and everything. However, it doesn’t work, someone help me please.

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <link rel="stylesheet" href="bootstrap.css">
</head>
<body class="d-block justify-content-center m-0">
    <script type="text/javascript">
        const title = document.createElement("h1");
        title.innerHTML = "My title";
        const divcominput = document.createElement("div");
        divcominput.classList.add('container');
        divcominput.classList.add('justify-content-center');
        divcominput.classList.add('d-block');
        divcominput.classList.add('bg-dark');

        const inputdadiv = document.createElement("input");
        inputdadiv.type = Text;
        inputdadiv.placeholder = 'Nome completo';

        divcominput.append(inputdadiv);
        divcominput.append(title);
    </script>

</body>
</html>
javascript html5

  • Syntax error on lines const title = document.createElement(h1), const divcominput = document.createElement(div); and const inputdadiv = document.createElement(input); .Place the parameters in quotes: const title = document.createElement("h1"), const divcominput = document.createElement("div"); and const inputdadiv = document.createElement("input");

1 answer

2


Has some coding errors, a clear example of error:

document.createElement(h1);

i.e., to create the element is between quotation marks (or h1 is a variable in the text type code containing const h1 = 'h1'; as content), correct example:

document.createElement('h1');

Another factor was encoded the elements but, not added within BODY or some specific element, that is, it failed to indicate where it would be added , I set a minimum example:

const title = document.createElement('h1')
title.innerHTML = "My title";
const divcominput = document.createElement('div');
divcominput.classList.add('container')
divcominput.classList.add('justify-content-center');
divcominput.classList.add('d-block');
//divcominput.classList.add('bg-dark');

const inputdadiv = document.createElement('input');
inputdadiv.type = Text;
inputdadiv.classList.add('form-control');
inputdadiv.placeholder = 'Nome completo';

divcominput.append(inputdadiv);
divcominput.append(title);

//Adicionando
var x = document.getElementsByTagName("BODY")[0];
x.append(divcominput);
<!-- CSS only -->
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BmbxuPwQa2lc/FVzBcNJ7UAyJxM6wuqIj61tLrc4wSX0szH/Ev+nYRRuWlolflfl" crossorigin="anonymous">

Browser other questions tagged javascript html5

You are not signed in. Login or sign up in order to post.