Question

我是否可以添加自定义JavaScript作为某些DOM节点属性，以便在点击它时执行时，添加为“onClick”属性

假设我需要使用一些 funcMyTransform 函数处理div元素。

我认为像这样编写smth会更优雅

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

而不是

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

是否有“onReady”属性或什么？

Answer 1

没有onReady事件。根据功能，您可能希望将funcMyTransform抽象为jQuery插件。 E.g。

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

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

如果您希望在“准备好”时立即访问该元素，那么将您的脚本放在文档的底部（</body>之前）可能是一个更好的主意，并且肯定更快（虽然稍微）启动比jQuery的伪“准备”事件。

Answer 2

正如其他人所说，无论什么属性都像“1999年这样”;-)。现代Javascript社区的普遍共识是，您应该尽可能避免使用它们（出于可维护性和其他原因）。

话虽如此，有一种方法可以以更易于维护的方式获得与您想要的东西非常相似的东西：

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

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

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

这种方法将为您提供能够决定HTML层中“转换onReady”的所有好处，但没有“onReady”属性的所有失败。脚本部分可以直接进入您在整个站点中使用的常见JS包含，因此您不必担心将其与每个DIV.onReadyDoMyTransform一起添加。

Answer 3

您是否准备好了jQuery？

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

我猜这不行，但值得一试？

Answer 4

你的建议是将代码与HTML混合为......更优雅是有争议的。

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

一般来说，这是不鼓励的，因为它会导致维护问题。如果我理解正确，在onReady事件被激活时，您想要调用所有这些功能。实际操作的一种方法是使用REL或您可能想要用作expando属性的任何其他内容。

在文档准备好捕获所有元素并读取属性的值，然后读取eval（）。（人们会告诉你eval（）是邪恶的，但在这里是无害的。）

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

它实际上将eval（）并激活你的REL属性中的所有javascript。

Answer 5

我之前使用过Stuart Colville的er（element-ready），之前有点类似于你所说的，除了它不是元素属性。

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

我在一个实例中使用了这个，我通过XHR请求返回一些html，我希望它执行一些javascript，但dom必须在我执行之前完成加载。当然，文档就绪不起作用，因为主文档已经加载了。

自定义JavaScript作为DOM节点属性，在准备就绪时执行

5 个答案: