Пользовательский JavaScript как атрибут узла DOM для выполнения, когда он будет готов

Question

Могу ли я добавить собственный JavaScript в качестве некоторого атрибута узла DOM для выполнения , когда он будет готов как JavaScript, добавленный как атрибут "onClick" , выполняемый, когда вы нажимаете на него

Предположим, мне нужно обработать элемент div с помощью некоторой funcMyTransform функции.

Я думаю, что было бы более элегантно написать что-то подобное

<div onReady=funcMyTransform(this)>...</div>

Вместо

<div id="MyElement">...</div>

<script type="text/javascript">
    $(document).ready(function(){$("#MyElement").funcMyTransform()});
</script>

Есть ли такой "onReady" атрибут или что-то еще?

Answer 1

Как уже говорили другие, независимо от того, какие атрибуты "похожи на 1999" ;-). Общее согласие среди современного сообщества Javascript заключается в том, что вы должны избегать их использования в максимально возможной степени (для удобства обслуживания и по другим причинам).

При этом существует способ получить нечто очень похожее на то, что вы хотите, в гораздо более удобной форме:

<div class="onReadyDoMyTransform">...</div>

<script type="text/javascript">
    $(function(){$(".onReadyDoMyTransform").funcMyTransform()});

    // $(someFunction) == $(document).ready(someFunction);
</script>

Этот подход даст вам все преимущества возможности решать, что «преобразует onReady» в вашем HTML-слое, но без всех сбоев атрибута «onReady». Часть сценария может просто перейти к общему JS-включению, которое вы используете на своем сайте, поэтому вам не нужно беспокоиться о добавлении его вместе с каждым DIV.onReadyDoMyTransform.

Answer 2

Нет события onReady. В зависимости от функциональности вы можете захотеть абстрагироваться funcMyTransform в плагин jQuery. Э.Г.

jQuery.fn.funcMyTransform = function() {
    alert(this.id);
};

jQuery(document).ready(function(){
    jQuery("#MyElement").funcMyTransform(); // Alerts => "MyElement"
});

Если вы хотите получить доступ к элементу, как только он «готов», тогда размещение сценария в нижней части документа (до </body>), вероятно, будет лучшей идеей и определенно быстрее (хотя и немного) инициировать чем псевдо "готовое" событие jQuery.

Answer 3

Я использовал er (готовый к элементам) Стюарта Колвилла до того, что это похоже на то, о чем вы говорите, за исключением того, что это не атрибут элемента.

http://muffinresearch.co.uk/archives/2006/04/12/element-ready/

Я использовал это в случае, когда я возвращал html через запрос XHR, и я хотел, чтобы он выполнил некоторый javascript, но dom должен был быть закончен, чтобы загрузить его, прежде чем я смог его выполнить. Конечно, готовый документ не работает, так как основной документ уже загружен.

Answer 4

Ваше предложение, что смешение кода с HTML, как ... более изящный спорно.

 <div onReady=funcMyTransform(this)>...</div>

Обычно это не рекомендуется, так как это приводит к проблемам с техническим обслуживанием. Если я вас правильно понял, при активации события onReady вы хотите вызвать все эти функции. Один из способов сделать это на самом деле - использовать REL или что-либо еще, что вы можете использовать в качестве атрибута расширения.

В документе готов захватить все элементы и прочитать значение атрибута, затем eval (). (Люди скажут вам, что eval () - это зло, но здесь он совершенно безвреден).

$(document).ready(function(){ var v= $('.class_name').attr('rel'); eval(v); })

Это на самом деле будет eval () и активирует весь ваш javascript в ваших атрибутах REL.

Answer 5

Вы уже попробовали jQuery?

 $("#MyElement").ready(function(){$(this).funcMyTransform()});

Полагаю, это не сработает, но стоит попробовать?