设计模式帮助:使用多个元素的jQuery
设计模式帮助:使用多个元素的jQuery
提问于 2015-05-28 22:19:56
我是jQuery的新手。我想知道当我在同一个.js文件中跨多个函数使用相同的元素时，访问该元素的最佳方法是什么，下面的是我可以想到的两种方法。我有作用域函数( F1 & F2)以及其他函数(F3、F4)。我想在一些或所有这些函数中使用元素。最好的方法是什么。
方法1
var elm1 = $("#ID1")
var elm2 = $("#ID2")
var elm2 = $("#ID3")
$(function () {
function F1() {
// work with elm1,elm2,elm3
}
function F2() {
// work with elm1,elm2,elm3
}
})
function F3() {
// work with elm1,elm2,elm3
}
function F4() {
// work with elm1,elm2,elm3
}方法2
var id1 = "#ID1";
var id2 = "#ID2";
var id3 = "#ID3";
$(function () {
function F1() {
// get elements usings IDs
var elm1 = $(id1)
var elm2 = $(id2)
var elm3 = $(id1)
}
function F2() {
// get elements usings IDs
var elm1 = $(id1)
var elm2 = $(id2)
var elm3 = $(id1)
}
})
function F3() {
// get elements usings IDs
var elm1 = $(id1)
var elm2 = $(id2)
var elm3 = $(id1)
}
function F4() {
// get elements usings IDs
var elm1 = $(id1)
var elm2 = $(id2)
var elm3 = $(id1)
}另一方面，我们为函数F3和F4使用了什么术语？全球功能？
回答 3
Stack Overflow用户
发布于 2015-05-28 22:28:32
方法1是两种方法中最好的一种，因为您重复使用对jQuery对象的引用，并且不需要每次都查询DOM。
顺便说一句，您应该始终使用IIFE模式(立即调用的函数表达式)对这些jQuery引用进行作用，并避免干扰全局范围(即window对象)：
(function() {
// Your code here
})();另一方面，我们为函数F3和F4使用了什么术语？全球功能？
是的，就是这样。或者是全球范围内的函数。无论如何，同样，你应该避免扰乱全局范围，更好地使用生命！
Stack Overflow用户
发布于 2015-05-28 22:44:03
简单答案:在变量或对象属性中存储对元素的引用。更像方法1。
方法2非常重复，当涉及到维护时，将是一个真正令人头痛的问题。
关于如何改进方法1的一些建议：
1)在domready事件之外定义您的函数，然后在domready中调用它们。等待定义函数/方法不会获得任何好处。但是，推迟初始化它们是明智的。
$(function() { /*do stuff*/}); //this is the shorthand for
$(document).ready(function() {/*do stuff*/});
var function1 function() = { /*do stuff*/};
$(function() { function1(); });2)从全局范围内删除所有内容。我更喜欢用生活(见下文)。
3)添加名称空间(见下文)。
(function($) { //your local $ value is now a local reference, if you ever have a clash in the dollar sign globally, you don't have to worry working inside this function.
window.namespace = window.namespace || {};
var namespace = window.namespace; //local reference to namespace obj.
namespace.elm1 = $("#elm1");
//etc
namespace.function1 = function() {
//this == namespace. use dot notation to access properties/methods in this scope, i.e:
console.log(this.elm1) //Object - the jQuery collection object
};
$(function() {
namespace.function1();
}
})(jQuery); //pass the jQuery object into your scopeStack Overflow用户
发布于 2015-05-28 22:28:17
第一种方法更好，不仅仅是在使用jQuery时。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/30518021
复制相关文章
相似问题
腾讯云开发者
