Zepto recurre a jQuery

6 minutos de lectura

Estoy usando ZeptoJS para mi aplicación web, pero me gustaría recurrir a jQuery si el navegador no es compatible con Zepto. Dado que IE es el único navegador importante que no es compatible en este momento, estoy tentado a detectar IE:

if(navigator.appName == 'Microsoft Internet Explorer'){
    // load jquery
} else {
    // load zepto
}

pero preferiría detectar específicamente el soporte de Zepto y usar jQuery en otros casos. ¿Hay una forma de detección de características para hacer esto?

  • Tengo algunas buenas respuestas de detección de IE aquí, pero estaría realmente interesado en una detección que coincida con los navegadores de zepto con mayor precisión.

    – jos3000

    5 de enero de 2012 a las 9:05

  • que terminaste usando. Veo su ejemplo para la detección de IE,

    – GnrlBzik

    25 de abril de 2012 a las 20:01

  • @GnrlBzik Eso es __proto__ 🙂

    - Alex

    29 de mayo de 2012 a las 1:34

  • sí, es @alex, gracias, no sé por qué no me di cuenta.

    – GnrlBzik

    29 mayo 2012 a las 17:52

También puedes usar el truco JS descrito aquí para detectar si el navegador es IE y usar una biblioteca de carga de secuencias de comandos asincrónica moderna para cargar la lib requerida. Sí, no. ejemplo:

yepnope({
  test: !+"\v1", // IE?
  yep: 'jquery.js',
  nope: 'zepto.js'
});

  • @Rocket: Malas noticias. Las sentencias condicionales deben usarse entonces.

    – Phil Pirozhkov

    7 de enero de 2012 a las 9:36

  • Estoy usando test: navigator.appName.match(/Explorer/) ahora.

    – Phil Pirozhkov

    10 de enero de 2012 a las 9:34


En lugar de hacer eso con Javascript, daría un paso adelante y usaría declaraciones condicionales. Esto podría parecerse a:

<!--[if lt IE 8 ]>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.js"></script>
<![endif]-->

<!--[if !IE]>
    <script src="/js/zepto.js"></script>
<![endif]-->

Esto va directamente a sus archivos HTML. El fragmento anterior cargará jQuery, si el navegador es Internet Explorer 7 e inferior. De lo contrario, incluirá zepto.js.

  • También asegúrese de cargar solo zepto y if not IE bloquear.

    – Raynos

    4 de enero de 2012 a las 11:23

  • Gracias: probé Zepto 0.8 en IE9 y no pareció funcionar, así que creo que tendré que tener un IE general -> jQuery

    – jos3000

    4 de enero de 2012 a las 11:57

  • Debiera ser <![if !IE]> o Zepto se eliminará como comentario.

    – Brian Níquel

    16 de enero de 2012 a las 18:38

  • Según un comentario ahora en el sitio de Zepto, los comentarios condicionales no son compatibles con IE 10, por lo que sería mejor evitar esto. Tienen una solución detallada en su página de inicio para IE. zeptojs.com

    –Josh Gallagher

    20 de agosto de 2012 a las 5:08

Como dijo la documentación de Zepto, si necesita para detectar Internet Explorer puedes usar este código:

  if ('__proto__' in {}) {
    // IS NOT IE

  } else {
    // IS IE

  }

Zepto lo usa para recurrir a jQuery, pero también lo he usado como detección del navegador.

  • Esa es una forma horrible de detectar IE (y está en la documentación de Zepto).

    - Alex

    20 de agosto de 2012 a las 2:27


  • Esto funciona para IE, sin embargo, Firefox 3.6 es válido para esta verificación (y definitivamente no es compatible con Zepto).

    - husky

    19 de octubre de 2012 a las 11:04

  • +1. Si este es su código recomendado, tienen sus razones. Como dijo OP, preferiría detectar el "soporte de Zepto" que IE directamente, y parece que esta es la forma preferida de Zepto de hacerlo. El futuro IE probablemente funcionará, lo cual, estoy seguro, es algo bueno.

    – Zach Lysobey

    26/03/2013 a las 21:40

  • Zepto no funciona en IE porque IE no es compatible __prototype__por lo que esta es exactamente la forma correcta de verificar.

    – nilskp

    2 abr 2013 a las 14:05

  • El punto no es detectar si es o no IE; el punto es que Zepto se basa en __proto__ e IE no tiene __proto__, por lo que esta es en realidad la forma correcta de verificar esto. Mirar cualquier cosa desde el navegador es ridículo, porque esencialmente solo está adivinando si la biblioteca funcionará o no en ese navegador en lugar de saber exactamente si funcionará o no. Por ejemplo, esto también recurrirá a jQuery en navegadores como Opera, y no volver a caer en (aparentemente) IE11

    – Travis Kaufmann

    13 de septiembre de 2013 a las 16:08

Esta podría ser una idea loca (no estoy seguro de si Zepto incluso se cargará en un navegador no compatible), pero ¿qué tal usar la detección de navegador de Zepto para ver si está en un navegador no compatible?

$.os.ios      // => true if running on Apple iOS
$.os.android  // => true if running on Android
$.os.webos    // => true if running on HP/Palm WebOS
$.os.touchpad // => true if running on a HP TouchPad
$.os.version  // => string with version number, "4.0", "3.1.1", "2.1", etc.
$.os.iphone   // => true if running on iPhone
$.os.ipad     // => true if running on iPad
$.os.blackberry // => true if running on BlackBerry

Tal vez podrías hacer algo como esto:

var isSupported = false;
for (os in $.os) {
    if ($.os[os] == true) { isSupported = true; }
}

Esto no detectará Chrome/Firefox, que funciona bien con Zepto, pero coincide con las intenciones del equipo de Zepto para la cosa, que puede o no ser mejor.

avatar de usuario
gagarina

No use los comentarios condicionales, no será compatible con IE10. Este es el enfoque recomendado por el documentación de zepto:

Cargue Zepto en un navegador moderno y jQuery en IE

<script>
document.write('<script src="https://stackoverflow.com/questions/8725905/+
("__proto__' in {} ? 'zepto' : 'jquery') +
'.js><\/script>')
</script>

Zepto no funciona en IE porque IE no es compatible prototipopor lo que esta es exactamente la forma correcta de verificar.

El script anterior hace una carga dinámica pero la lógica es

<script>
if ('__proto__' in {}) {
  // This is NOT IE

  } else {
    // This is IE

  }
</script>

  • En su ejemplo de comentario condicional, tanto IE9 como IE10 no obtienen ningún script.

    – Zach Lysobey

    26 de marzo de 2013 a las 21:41

  • @ZachL gracias. Eliminé el ejemplo de comentario condicional porque de todos modos no es compatible con IE10.

    - gagarina

    29 de marzo de 2013 a las 13:23

avatar de usuario
Cerveza inglesa

<script>
  document.write('<script src="https://stackoverflow.com/questions/8725905/+ ("__proto__' in {} ? 'zepto' : 'jquery') + '.js><\/script>')
</script>

Este es el método recomendado en el sitio oficial de zepto.js. Ver http://zeptojs.com/#download

  • En su ejemplo de comentario condicional, tanto IE9 como IE10 no obtienen ningún script.

    – Zach Lysobey

    26 de marzo de 2013 a las 21:41

  • @ZachL gracias. Eliminé el ejemplo de comentario condicional porque de todos modos no es compatible con IE10.

    - gagarina

    29 de marzo de 2013 a las 13:23

avatar de usuario
mckamey

Si bien muchas de las respuestas existentes funcionan bien al cargar Zepto.js a través de una solicitud adicional, tengo una situación en la que sé que Zepto será suficiente la mayor parte del tiempo y solo quiero fusionarlo con mis scripts y cargar jQuery de forma perezosa si es necesario. Preparé un pequeño envoltorio para Zepto que hará exactamente eso.

Corre el "oficial" '__proto__' in ... prueba y lazy carga jQuery si falla. Si tiene éxito, continúa cargando Zepto.

Descubrí que IE8 explotaría incluso si se cargaba Zepto. Esto soluciona eso omitiendo el resto del módulo.

Para el caso optimista, no hay solicitudes de script adicionales. Para la ruta jQuery, bueno, esos usuarios no estaban obteniendo exactamente la experiencia rápida de todos modos.

¿Ha sido útil esta solución?