Динамическое создание элементов javascript. Работа с CSS на javascript. Как создать элемент с помощью scriptjava?

Прежде чем начать создавать элементы, перед тегом head подключим scriptjava фреймворк

<script type="text/javascript" src="http://scriptjava.net/source/scriptjava/scriptjava.js"></script>

Теперь можно приступить к созданию элементов, для этого пишем вот такой код:

<script type="text/javascript">
//создаю элемент
var new_div = $$i({
  create:'div',
  attribute: {
    'style':'color:#00ffff; width:300px; height:50px; background:#0000ff;'
  },
  insert:$$().body
});
//прописываем стили для осла 6 версии IE6
$$(new_div).$$('color','#00ffff').$$('width','300px').$$('height','50px').$$('background','#0000ff');
//вставляю текст
$$(new_div).$$('Всем привет!');
</script>

Как видите все довольно просто
Мы создали новый div и вставили в него текст Всем привет!

С помощью строки

$$(new_div).$$('color','#00ffff').$$('width','300px').$$('height','50px').$$('background','#0000ff');

мы повторно добавили стили CSS которые уже были созданы при создании элемента и прописаны в свойстве attribute
Есле вы все еще не можете расстаться с ослом 6 версии (IE6) и ниже, то прийдется вот именно так решать проблему добавления стилей.
Впрочем эта строка не обязательна.

В свойстве insert мы указали куда будет вставлен новый элемент - в тело документа

удалить созданный элемент также просто как и создать

$$().body.removeChild(new_div);

Работать с CSS в scriptjava очень просто
Допустим у нас на странице есть элемент

<div id="code"></div>

и мы решили поменять стили у этого элемента, вставить текст

нет ничего проще

$$('code','текст').$$('color','#00ffff').$$('background','#0000ff');

можно написать и так

$$('code').$$('color','#00ffff').$$('background','#0000ff').$$('текст');

или даже так

$$('code','color','#00ffff').$$('текст').$$('background','#0000ff');

Эти коды делают одно и тоже, результат будет одинаковым

Теперь допустим на странице несколько элементов, и для них так же нужно поменять стили и вставить текст...

<div id="code1"></div>
<div id="code2"></div>

добавим стили к этим элементам и вставим текст

$$('code1','текст1').$$('color','#00ffff').$$('background','#0000ff');
$$('code2','текст2').$$('color','#00ffff').$$('background','#0000ff');

но все это дело можно переписать и в одну строку, результат будет таким же

$$('code1','текст1').$$('color','#00ffff').$$('background','#0000ff').$$().$$('code2','текст2').$$('color','#00ffff').$$('background','#0000ff');

Элементов может быть больше, ограничений нет

вот например такой код

$$().body

не что иное как

document.body

Но не нужно думать что на этом возможности библиотеки работы с DOM заканчиваются, на против это только начало длинной истории...