Javascript对象文字和jQuery
[英]Javascript Object Literals and jQuery
问题描述
我在这里更新了脚本，以提供更好的示例。 对于$ header，我现在有一个匿名函数返回$（“＃header”） 。 尽管此方法有效，但我确信它的效率不高，因为每次使用它都会调用$ header，因此它与在整个代码中仅使用$（“＃header”）相同 。
我真正想要的是将$（“ header”）存储在变量中。 当我尝试使用$ header2（下）执行此操作时，它失败。 #header是红色而不是蓝色。
当我使用firebug输出lib.page。$ header2.selector时 ，正确显示#header 。 如您所见，调用lib.page.init的脚本在DOM的底部。
有任何想法吗？
<script type="text/javascript">
var lib = {
page : {
$header : function() { return $("#header")},
$header2 : $("#header"),
init: function() {
lib.page.$header().css("background","red");
lib.page.$header2.css("background","blue");
console.log(lib.page.$header2.selector);
}
}
}
</script>
</head>
<body>
<div id="wrapper">
<div id="header">
<em>Example!</em>
</div>
</div>
<script type="text/javascript">
$(function() { lib.page.init(); });
</script>
</body>
2 个解决方案
解决方案1
2 2010-09-02 20:23:01
因为当您定义$header : $('#header') ，该元素不可用？ 当您调用lib.page.init它是？ 我不确定何时调用lib.page.init ，但是我敢打赌它在$(document).ready()对吗？ 然后在dom准备就绪之前定义对象文字。
好的，您要将div＃header分配给$ header时不可用，您有两个选择，我将首先向您展示最佳选择。 我的意思是“将所有脚本放在底部”！
<head>
<!-- dont put scripts here if you can avoid it, it's bad! -->
</head>
<body>
<div id="wrapper">
<div id="header">
<em>Example!</em>
</div>
</div>
<!-- keep scripts at the end of the page just before the </body> tag -->
<script type="text/javascript">
var lib = {
page : {
// div#header is available
$header : $("#header"),
init: function() {
lib.page.$header().css("background","red");
}
}
}
// you don't need onDomReady anymore.
lib.page.init();
</script>
</body>
如果要将脚本保留在标头中，另一种选择是在onDomReady调用中分配$ header。
<script>
// create lib etc here
$(function(){ // this is an onDomReady call in jQuery
lib.page.$header = $('#header');
lib.page.init();
});
</script>
解决方案2
1 已采纳 2010-09-07 00:20:47
“发生这种情况是因为在解释脚本时实例化了变量。因此，在解析器进入脚本时，$（“＃header”）不在DOM中。”
JavaScript对象文字和数组文字
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.