правильный синтаксис для чистого JavaScript

Question

У меня есть этот код:

function render(str)
{
    var main = document.createElement('div');
    with(main.style)
    {
          //style stuff here
    }

    main.appendChild(document.createTextNode(str));
    document.body.appendChild(main);

    setTimeout(function(){
        try{
            document.body.removeChild(main);
        }   catch(error){}
    },5000);
}

Это делает сообщение внутри div, а затем скрывается через 5 секунд.

Как я могу добавить входной текст и изображение в эту форму? Поскольку я не уверен, как я могу сделать с чистым JS.

Answer 1

Примерно так:

ввод

var input = document.createElement("input");
input.type = "text";
input.name = "person";

document.body.appendChild(input);

изображение img = document.createElement ("img"); img.src = "logo.png";

document.body.appendChild(img);

Смотрите живой пример здесь:

• http://jsfiddle.net/sM2Vd/

Я бы предложил, однако, изучить и использовать что-то вроде jQuery - это отличная библиотека, которая делает такие вещи на одном дыхании.

Смотрите в этом SOq похожую вещь - создайте элемент input (в данном случае скрытый) с помощью jQuery и сравните с простым JavaScript:

• Jquery - Создание скрытого элемента формы на лету

Answer 2

Вместо использования

with(main.style)
    {
          //style stuff here
    }

и выполнения нескольких манипуляций со стилем,

записывает все назначения стилей за один раз

main.style.cssText = '//Строка в стиле CSS здесь