-2

I am newer in javascript,so maybe my question will seem nail to some of you. I have this row it's create div element:

 <div id = "popUpWin" style = "width:' + width + 'px; height:' + height + 'px;"></div>;

My question is how to create this row dynamically using JavaScript?

2

1 Answer 1

1

There are at least a couple of ways to do this.

  1. Use document.createElement, which is one of the DOM API functions.

    // Create the element
    var d = document.createElement('div');
    
    // Set its ID
    d.id = "popUpWin";
    
    // Set the style properties on the element's `style` object
    d.style.width = width + "px";
    

    d.style.height = height + "px";

    ...and then presumably put it somewhere in the document using appendChild or insertBefore or similar on another element already in the document.

  2. Use insertAdjacentHTML on an existing element:

    theOtherElement.insertAdjacentHTML(
        'beforeend',
        '<div id = "popUpWin" style = "width:' + width + 'px; height:' + height + 'px;"></div>'
    );
    

    That example would add the div as a child right at the end of the existing element (without disturbing other elements already in it).

  3. Use innerHTML on an existing element, if you want to replace its content:

    theOtherElement.innerHTML =
        '<div id = "popUpWin" style = "width:' + width + 'px; height:' + height + 'px;"></div>';
    

    Note that that will remove any other elements inside theOtherElement and replace them with just that div.

Sign up to request clarification or add additional context in comments.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.