JavaScript add HTML elements 🌎



Javascript dom manipulation createElement tutorial example explained

#javascript #create #element

// ********* index.js *********

// create HTML elements
// h1.innerHTML (vulnerable to XSS attacks)
// h1.innerText (better)

const h1 = document.createElement(“h1”);
const underline = document.createElement(“u”);
underline.innerText = “Hello World!”;
h1.append(underline);
document.body.append(h1);

const h2 = document.createElement(“h2”);
const italic = document.createElement(“i”);
italic.innerText = “Sup?”;
h2.append(italic);
document.body.append(h2);

const p = document.createElement(“p”);
const bold = document.createElement(“b”);
bold.innerText = “Bye…”;
p.append(bold);
document.body.append(p);

11 thoughts on “JavaScript add HTML elements 🌎

  1. // ******* index.js *******

    // create HTML elements

    // h1.innerHTML (vulnerable to XSS attacks)

    // h1.innerText (better)

    const h1 = document.createElement("h1");

    const underline = document.createElement("u");

    underline.innerText = "Hello World!";

    h1.append(underline);

    document.body.append(h1);

    const h2 = document.createElement("h2");

    const italic = document.createElement("i");

    italic.innerText = "Sup?";

    h2.append(italic);

    document.body.append(h2);

    const p = document.createElement("p");

    const bold = document.createElement("b");

    bold.innerText = "Bye…";

    p.append(bold);

    document.body.append(p);

  2. Bro, I am watching you from nearly 9 months. I am really happy to have your channel in my subcription list of channels. Bro, Once you finish making videos on javascript. I wish to see About React and Later on React native.

Leave a Reply

Your email address will not be published. Required fields are marked *