La diferencia entre zepto y jquery, los diferentes usos de zepto para 8 resúmenes
Por ejemplo, ejecución: $({}).bind('cust', function(){});
Resultado: Error de tipo: El objeto no tiene el método 'addEventListener'
Solución. Cree un nodo como objeto de evento a partir del flujo de documentos:
Ejemplo: $('').bind('cust', function. () {});
2. Expresión del selector de Zepto: [nombre=valor] donde el valor debe estar entre comillas dobles "" o comillas simples ""
Por ejemplo, ejecutar: $('').bind('cust', function(){});
Por ejemplo, ejecutar: $('').bind('cust', function(){} );
p>2. ('[data-userid=123123123]')
Resultado: Error: Error de sintaxis: Excepción DOM 12
Solución: $('[data-userid="123123123]"') o $("[data-userid=' 123123123']")
2-1. El selector de zepto no puede seleccionar $("div[name !=' abc']")"
2-2.zepto no puede usar el método similar a jq $('option[selected]') para obtener la opción seleccionada del elemento seleccionado porque el atributo seleccionado no es un atributo estándar Debido a que el atributo seleccionado no es un atributo estándar de CSS
Deberías usar $('option').not(function(){ return !this.selected })
Por ejemplo: jq:$ this.find('opción[seleccionado]').attr ('data-v') * 1
zepto:$this.find('opción') .not(function(){return !this .selected}).attr('data-v') * 1
Sin embargo, para obtener los elementos seleccionados con el atributo deshabilitado, puede usar $this. find("option:not(:disabled) "), porque deshabilitado es un atributo estándar
3. Zepto está escrito de acuerdo con los navegadores estándar, por lo que el método de tamaño de nodo solo proporciona ancho() y alto(). , omitiendo InnerWidth() y InnerHeight (), externalWidth(), InnerHeight() y InnerHeight(). InnerHeight(),outerWidth(),outerHeight()
Zepto.js: determinado por el tamaño del cuadro
jQery: ignora el tamaño del cuadro y siempre devuelve el ancho/alto del contenido área (excluyendo relleno y bordes). Utilice .css('width') en lugar de .width().
3-1. Obtén el ancho y alto del triángulo del borde
Supongamos que dibujas un pequeño triángulo usando el siguiente HTML y CSS:
.caret { ancho: 0; alto: 0; ancho del borde: 0 20px 20px; color del borde: azul transparente transparente; ninguno con puntos sólidos; p >jQuery usa .width() y .css('width') para devolver la misma altura;Zepto usa .width() para devolver, .css('width') devuelve 0px.
Entonces, en este caso, jQuery usa .outerWidth() / .outerHeight(); Zepto usa .width() / .height() .
3-2.offset()
Zepto.js: Devuelve arriba, izquierda, ancho, alto
jQuery: Devuelve ancho, alto
3-3.Elementos ocultos
Zepto.js: No se puede obtener el ancho y el alto;
jQuery: Se puede obtener.
4. Cada método de Zepto solo puede atravesar matrices, no objetos JSON.
5. Descripción del parámetro del método animado de Zepto:
$("# some_element"). animar ({ opacidad: 0.25, izquierda: '50px', color: '#abcdef', '#abcdef'). color: '#abcdef', rotarZ: '45deg', traducir3d: '0,10px, 0' }, 500, 'ease-out')
$this_bd.animate({ height:iTthis_bd_h+'px',complete:siblingsUp() },700) ; function siblingsUp(){ $this_bd.siblings('.bd').animate({height:'0px'},50); };
Notaremos que el completo de zepto se ejecutará primero antes. la animación animada, por lo que la función de devolución de llamada debe escribirse más tarde, por ejemplo:
$('.warter').animate({margin:'150px 0 0 -80px',opacity: '1', rotar:'-45deg'},800,'ease-in-out',function(){alert(1);});
6. El nombre de la función de devolución de llamada jsonp de zepto no puede ser Personalización
7. Diferencias en la operación DOM
código jq:
(function($) { $( function() { var $list = $('
- inserción de jQuery
No se agregará la identificación en la operación ul de jQuery.
Código Zepto:
Zepto(función($) { var $lista = $('
- Inserción Zepto
Zepto puede agregar id a ul.
8. Diferencias de activación de eventos
código jq:
(function($) { $(function() { $script = $('