基本jQuery语法问题(优化)
基本jQuery语法问题(优化)
提问于 2022-03-16 09:48:39
我有一个.js文件，它的许多函数都应用于一个页面。我正在努力优化我的jQuery代码，以减少加载时间。
许多函数都是这样定义的：
$(document).on( "change", ".fields-abc", function () { ... });
$(document).on( "change", ".fields-xyz", function () { ... });由于这些函数的目标字段位于同一个div#myid中，所以我可以通过在选择器中包括#myid来提高加载时间：
$(document).on( "change", "#myid .fields-abc", function () { ... });
$(document).on( "change", "#myid .fields-xyz", function () { ... });但是我想如果#myid在一个变量中，那么我在所有不同的函数中针对这个变量会更好吗？
如果这确实更好，我如何修改语法来针对这个变量呢？像这样？
var myidvariable = $("#myid");
$(document).find(myidvariable).on( "change", "#myid .fields-abc", function () { ... });
$(document).find(myidvariable).on( "change", "#myid .fields-xyz", function () { ... });我想不会..。
回答 2
Stack Overflow用户
发布于 2022-03-16 09:55:15
始终将事件添加到关闭静态元素。因此，如果您不以编程方式替换#myid，则以它为目标并链接您的调用。
$('#myid')
.on('change', '.fields-abc', function () {})
.on('change', '.fields-xyz', function () {})请注意，如果var parent = $('#myid')和.fields-*也是静态的，那么可以将元素作为第二个参数传递给jQuery构造函数。
var parent = $('#myid');
$('.fields-abc', parent).change(function () {})Stack Overflow用户
发布于 2022-03-16 10:24:20
我正试图优化以减少加载时间
在加载时间方面，代码中最慢的部分是初始选择器。
$(document)事件的selector参数不会影响加载时间，因为它只是一个字符串，不会用于初始化事件。
因此，优化代码的最佳方法是减少$(selector)的出现，在您的情况下，您可以这样做：
var doc = $(document);
doc.on("change", ".abc", ...);
doc.on("change", ".xyz", ...);或者利用jquery的链接
$(document)
.on("change", ".abc", ...)
.on("change", ".xyz", ...);(注意;只在第二个.on()之后)
如前所述，您可以使用“更接近”的元素，但同样的原则适用，而不是：
$("#id").on(..);
$("#id").on(..);链接DOM查询
$("#id").on(..).on(..);页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/71494838
复制相关文章
相似问题
腾讯云开发者
