jquery - zepto.js : Viewport and Lazyload plugins?

Question

我曾经使用 jQuery 并正在使用

• jQuery LazyLoad 插件 http://www.appelsiini.net/projects/lazyload
• jQuery 视口(viewport)插件 http://www.appelsiini.net/projects/viewport

我现在使用zepto.js而不是 jQuery，当然现在插件都出现以下错误。

Uncaught ReferenceError: jQuery is not defined

如果我将两个插件从 })(jQuery); 更新为 })(Zepto); 则会出现以下错误...

Uncaught TypeError: Cannot read property ':' of undefined

对此有什么想法吗？是否可以让这些插件与 Zepto 一起使用？ Zepto 是不是几乎与 Jquery 一样，只是没有较旧的浏览器兼容性和额外的触摸事件？

提前谢谢您。

马特

Answer 1

导致错误的行似乎是:

.extend($.expr[':'], {

jQuery 使用自己的 CSS 样式选择器评估器，称为 Sizzle。除了允许您使用 $('#id .cls1 .cls2, #otherid') 和标准 CSS 伪选择器之外，它还支持使用自定义选择器进行扩展，例如内置 :visible 选择器或此插件提供的 :above-the-fold 选择器。

由于现代移动浏览器支持用于 CSS 选择的 native document.querySelectorAll 函数，因此不需要像 Sizzle 这样的库，从而节省了大量的 JavaScript。 (这就是我们喜欢 Zepto 的原因。)副作用是不支持这些自定义选择器并且 $.expr 不存在。任何依赖于这些的行(包括插件中的该行)都会失败。

好消息是，这些都是方便的选择器，您可以将它们从脚本中删除。如果您不想以这种方式查找折叠上方和下方的元素，则可以将它们从代码中删除。您还需要解决库调用 $this.is(":visible") 的行，但除此之外，我真的没有看到任何太特定于 jQuery 的内容。