Нужна помощь! Обработка JS событий до загрузки HTML кода
 

Здравствуйте! У меня такая проблема:
Есть код:

<!-- JS -->

<script type='text/javascript'>

 document.querySelector('#mytest').onclick=function(){
 alert('Тест удался!');

}
</script>

<!-- HTML -->

<span id='mytest'>Click ME</span>

Обработчик не работает, т.к. еще не обработан HTML, я вычитал вариант использовать window.onload , но это слишком громоздко и проблематично.
Моя проблема заключается в следующем: Мне нужно, что бы все обработчики событий и все возможные функции JS работали верху, до написания HTML, т.к. писать JS код после HTML мне не нравиться.
P.S. Привык как в php пишешь код скрипта в верху, а html уже в низу.
Хочу так-же только с JS.
Надо чтобы работало как у Jquery т.е.

$('бал бал').click(
                        function(){ alert('бла бла');}
                       );

Помогите пожалуйста решиться задачу!

onload - самый легкий, кроссбраузерный и понятный способ решения этой проблемы.

onload = function() {

здесь код, в том числе и для работы с DOM-деревом

};

Или подключай библиотеки вверху страницы, а свои скрипты внизу.

2 лишние строчки - это громоздко?

qvab,
:yes:А Что мешает добавить библиотеку jQuery на страницу?

(Сегодня форма одежды - порадная - белый верх - черный низ - (Привык я так....) Хотя сам в футболке

Лишние 90кб ради одной бессмысленной фичи?

а не проще взять именно то что нужно из библиотеки а не подключать ее полностью

Раед,
Мну по себе судит - поставил 90 - остальные скрипты сократились на 40-50 %
Не забывайте про кешируемость, в отличие от полнотекстовых скриптов на странице - библиотека грузится только в первый раз!

Господа! Jquery - не вариант, для меня это... как чистить зубы чужой щеткой, не люблю я библиотеки, сокращают потенциал...
Если кто знает, какие образом в Jquery события прописанные в верху работаю? Как там обрабатывается код?

P.S. На самом деле пишу свою библиотеку для своих нужд, только не обходимое: hide, show, fadeIn, fadeOut и т.п. По этому Jquery мне не как не надо.

ну дак проверяйте есть появился ли элемент в dom дереве и выполняйте события привязанные к нему. Для этого делайте "стек событий" каждый элемент которого -элемент для какого подвязано событие,событие , и действие.
Т.е наблюдайте за всеми событиями на странице,при появлении такого что есть в "стеке" проверяйте произошло ли на необходимом элементе , и если да выполняйте действие.-Что то на манер наблюдателя

По моему путь гораздо длиннее.

qvab,
Чем вас window.onload не устраивает?