Динамическое подключение CSS стилей и javascript скриптов, аналог функции eval javascript и динамическое создание элементов

Очень часто требуется динамически подключить внешний скрипт и запустить из него какую нибудь функцию.
Но вот отследить загрузку самого скрипта не всегда просто.
Я обычно избавляюсь от проблем с подключением так:

Вначале подключаю библиотеку

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

А вот собственно и сам код:

<script type="text/javascript">
$$i({
	attribute: {//устанавливаю атрибуты
		'type':'text/javascript',
		'src':'http://nagon.net/js/NRMSLib.js'
	},
	onready:function() {//действие по окончании подключения скрипта
		modules.sound.start();//запускаю метод из подключенного скрипта
	}
});
</script>

Иногда требуется динамически подключить не скрипт, а стиль CSS

В этом случае нет ничего проще чем воспользоваться тем же самым кодом, немного усовершенствовав его

<script type="text/javascript">
$$i({
	create:'link',//создаю элемент link
	attribute: {//устанавливаю атрибуты
		'rel':'stylesheet',
		'type':'text/css',
		'href':'style.css'
	},
	insert:$$s.getelbytag('head')[0]//подключаю стиль после тега head
});
</script>

В этом примере мы динамически подключили файл style.css

Как ни странно, но иногда нужно динамически подключить не файл со стилями, а просто вставить стиль в виде обычного текста.
В яваскрипте для вставки скрипта в виде текста предусмотрена функция eval.
Примерно нечто похожее есть в scriptjava для подключения стиля.

<script type="text/javascript">
$$i({
	create:'style',//создаю элемент style
	attribute: {//устанавливаю атрибуты
		'type':'text/css'
	},
	insert:$$s.getelbytag('head')[0]//подключаю стиль после тега head
}).$$('body {background-color:#000000;}');//вставляю стиль
</script>

Выполнение этого скрипта тоже самое что просто добавление стиля на страницу

<style type="text/css">
	body {
		background-color:#000000;
	}
</style>

Раз я затронул функцию eval, покажу ее аналог

<script type="text/javascript">
	$$i().$$('alert("scriptjava");'); 
</script>

код аналогичен

<script type="text/javascript">
	eval('alert("javascript");');
</script>

Но на этом возможности функции $$i не заканчиваются
С помощью нее можно без труда создавать любые элементы (в данном случае слой div)

<script type="text/javascript">
var div = $$i({
	create:'div',//создаю элемент div
	attribute: {},//устанавливаю атрибуты
	insert:$$().body//вставляю элемент после тега body
});
div.$$('backgroundColor','#ff0000').$$('width','300px').$$('height','30px').$$('Динамически созданный слой'); 
</script>

Удалить созданный элемент так же просто как и создать его
Кстати конструкция относится ко всем вышеперечисленным скриптам

<script type="text/javascript">
$$().body.removeChild(div);
</script>

Более подробную информацию смотрите на сайте

Автор: olololchik