$()

$(selector, [context])  ⇒ collection
$(<Zepto collection>)  ⇒ same collection
$(<DOM nodes>)  ⇒ collection
$(htmlString)  ⇒ collection
$(htmlString, attributes)  ⇒ collection v1.0+
Zepto(function($){ ... }) 

Crea un objeto de colección Zepto ejecutando selectores CSS, envolviendo nodos DOM, o creando múltiples elementos a partir de una cadena HTML.

Una colección Zepto es un objeto similar a un array que tiene métodos encadenables para manipular los nodos DOM a los que apunta. Excepto $(Zepto) además de los métodos directos en el objeto (como$.extend), todos los métodos del objeto document son métodos de colección.

Si el selector contiene un parámetro content (selector CSS, DOM o un objeto de colección Zepto), entonces solo se realiza el selector CSS dentro del contexto del nodo dado; esta función y el uso$(context).find(selector)Es lo mismo.

Cuando se proporciona un fragmento de cadena HTML para crear un nodo DOM. También se pueden crear nodos mediante un mapa de atributos. Para crear un solo elemento de la forma más rápida, usa<div>o<div/>Forma.

Cuando una función se une aDOMContentLoadeden el flujo de procesamiento de eventos. Si la página ya ha terminado de cargarse, este método se ejecutará inmediatamente.

$('div')  //=> 所有页面中得div元素
$('#foo') //=> ID 为 "foo" 的元素

// 创建元素:
$("<p>Hello</p>") //=> 新的p元素
// 创建带有属性的元素:
$("<p />", { text:"Hello", id:"greeting", css:{color:'darkblue'} })
//=> <p id=greeting style="color:darkblue">Hello</p>

// 当页面ready的时候，执行回调:
Zepto(function($){
  alert('Ready to Zepto!')
})

No soportaextensiones CSS de jQuery, sin embargo, el módulo opcional 'selector' proporciona soporte limitado para varios pseudo-selectores de uso común, y puede descartarse, ejecutándose de forma compatible con el código o plugins existentes.

Si$La variable aún no está definida, Zepto solo establece la variable global.$apunta a sí mismo. Le permite usar Zepto junto con código heredado útil, como prototype.js. Siempre que cargue Prototype primero, Zepto no sobrescribirá el de Prototype $ función. Zepto siempre establecerá la variable global.Zeptoapunta a sí mismo.

$.camelCase v1.0+

$.camelCase(string)  ⇒ string

Convierte una cadena en una nueva cadena en notación 'camelCase'; si el carácter ya está en notación camelCase, no cambia.

$.camelCase('hello-there') //=> "helloThere"
$.camelCase('helloThere')  //=> "helloThere"

$.contains v1.0+

$.contains(parent, node)  ⇒ boolean

Comprueba si el nodo padre contiene el nodo DOM dado; si ambos son el mismo nodo, devuelvefalse。

$.each

$.each(collection, function(index, item){ ... })  ⇒ collection

Itera sobre elementos de array o sobre objetos en pares clave-valor. La función de callback devuelvefalsecuándo detener la iteración.

$.each(['a', 'b', 'c'], function(index, item){
  console.log('item %d is: %s', index, item)
})

var hash = { name: 'zepto.js', size: 'micro' }
$.each(hash, function(key, value){
  console.log('%s: %s', key, value)
})

$.extend

$.extend(target, [source, [source2, ...]])  ⇒ target
$.extend(true, target, [source, ...])  ⇒ target v1.0+

Extiende las propiedades del objeto destino con las propiedades del objeto fuente; las propiedades del objeto fuente sobrescribirán las del objeto destino.

Por defecto, se realiza una copia superficial (copia superficial). Si el primer parámetro es `true`, indica una copia profunda (copia profunda).

var target = { one: 'patridge' },
    source = { two: 'turtle doves' }

$.extend(target, source)
//=> { one: 'patridge',
//     two: 'turtle doves' }

$.fn

Zepto.fnes un objeto que tiene todos los métodos disponibles en el objeto Zepto, comoaddClass()， attr(), y otros métodos. Si añades un método a este objeto, todos los objetos Zepto podrán usar dicho método.

Aquí hay una implementación de Zeptoempty()Ejemplo del método:

$.fn.empty = function(){
  return this.each(function(){ this.innerHTML = '' })
}

$.grep v1.0+

$.grep(items, function(item){ ... })  ⇒ array

Obtiene un nuevo array que solo contiene los elementos del array para los cuales la función de callback devuelve true.

$.grep([1,2,3],function(item){
    return item > 1
});//=>[2,3]
    

$.inArray v1.0+

$.inArray(element, array, [fromIndex])  ⇒ number

Devuelve el índice (nota de Yuren Matou: basado en 0) del elemento especificado en el array; si no se encuentra el elemento, devuelve-1。

Nota de Muelle del Tonto:[fromIndex]El parámetro es opcional, indica desde qué índice comenzar la búsqueda hacia delante.

$.inArray("abc",["bcd","abc","edf","aaa"]);//=>1

$.inArray("abc",["bcd","abc","edf","aaa"],1);//=>1

$.inArray("abc",["bcd","abc","edf","aaa"],2);//=>-1
         

$.isArray

$.isArray(object)  ⇒ boolean

Devuelve true si object es un array.

$.isFunction

$.isFunction(object)  ⇒ boolean

Devuelve true si object es una function.

$.isPlainObject v1.0+

$.isPlainObject(object)  ⇒ boolean

Comprueba si el objeto es un objeto 'puro', es decir, creado mediante un literal de objeto ("{}") onew Objectcreado; si es así, devuelve true.

$.isPlainObject({})         // => true
$.isPlainObject(new Object) // => true
$.isPlainObject(new Date)   // => false
$.isPlainObject(window)     // => false

$.isWindow v1.0+

$.isWindow(object)  ⇒ boolean

Si el parámetro object es un objeto window, devuelve true. Esto es muy útil al trabajar con iframes, porque cada iframe tiene su propio objeto window; usar métodos convencionalesobj === windowpara validar estos objetos fallaría.

$.map

$.map(collection, function(item, index){ ... })  ⇒ collection

Itera sobre los elementos de la colección y devuelve todos los resultados de la función de iteración (nota de Yuren Matou: un nuevo array).nullyundefinedse filtrará.

$.map([1,2,3,4,5],function(item,index){
        if(item>1){return item*item;}
}); 
// =>[4, 9, 16, 25]

$.map({"yao":1,"tai":2,"yang":3},function(item,index){
    if(item>1){return item*item;}
}); 
// =>[4, 9]

$.parseJSON v1.0+

$.parseJSON(string)  ⇒ object

nativamenteJSON.parsealias del método. (Nota de Yuren Matou: acepta una cadena JSON en formato estándar y devuelve el objeto JavaScript parseado.)

$.trim v1.0+

$.trim(string)  ⇒ string

Elimina los espacios en blanco al principio y al final de la cadena. Similar a String.prototype.trim().

$.type v1.0+

$.type(object)  ⇒ string

Obtiene el tipo de un objeto JavaScript. Los tipos posibles son:null undefined boolean number string function array date regexp object error。

Para otros objetos, simplemente informa 'object'; si quieres saber si un objeto es un objeto común de JavaScript, usaisPlainObject。

add

add(selector, [context])  ⇒ self

Añade elementos al conjunto actual de elementos coincidentes. Si se proporciona el parámetro content, solo se buscará dentro de los elementos content; de lo contrario, se buscará en todo el document.

<ul>
    <li>list item 1</li>
    <li>list item 2</li>
    <li>list item 3</li>
</ul>
<p>a paragraph</p>

<script type="text/javascript">
    $('li').add('p').css('background-color', 'red');
</script>

addClass

addClass(name)  ⇒ self
addClass(function(index, oldClassName){ ... })  ⇒ self

Añade las clases especificadas a cada elemento coincidente. Varias clases se separan con espacios.

after

after(content)  ⇒ self

Inserta contenido después de cada elemento coincidente (nota de Yuren Matou: inserción externa). El contenido puede ser una cadena HTML, nodos DOM o un array de nodos.

$('form label').after('<p>A note below the label</p>')

append

append(content)  ⇒ self

Inserta contenido al final de cada elemento coincidente (nota de Yuren Matou: inserción interna). El contenido puede ser una cadena HTML, nodos DOM o un array de nodos.

$('ul').append('<li>new list item</li>')

appendTo

appendTo(target)  ⇒ self

Inserta los elementos coincidentes al final del elemento destino (nota de Yuren Matou: inserción interna). Esto es algo parecido aappend, pero el destino de la inserción es el contrario.

$('<li>new list item</li>').appendTo('ul')

attr

attr(name)  ⇒ string
attr(name, value)  ⇒ self
attr(name, function(index, oldValue){ ... })  ⇒ self
attr({ name: value, name2: value2, ... })  ⇒ self

Lee o establece atributos del DOM. Si no se proporciona el parámetro value, lee el valor del atributo del primer elemento del conjunto de objetos. Cuando se proporciona value, establece el valor de ese atributo en todos los elementos del conjunto. Cuando el parámetro value esnull, entonces esta propiedad será eliminada (similar aremoveAttr), varios atributos se pueden establecer mediante pares clave-valor en un objeto.

Para leer atributos del DOM, comocheckedyselected, usaprop。

var form = $('form')
form.attr('action')             //=> 读取值
form.attr('action', '/create')  //=> 设置值
form.attr('action', null)       //=> 移除属性

// 多个属性:
form.attr({
  action: '/create',
  method: 'post'
})

before

before(content)  ⇒ self

Inserta contenido antes de cada elemento coincidente (nota de Yuren Matou: inserción externa). El contenido puede ser una cadena HTML, nodos DOM o un array de nodos.

$('table').before('<p>See the following table:</p>')

children

children([selector])  ⇒ collection

Obtiene los hijos directos de cada elemento de la colección de elementos coincidentes. Si se proporciona un selector, el resultado solo incluye los elementos que coinciden con el selector CSS.

$('ol').children('*:nth-child(2n)')
//=> every other list item from every ordered list

clone v1.0+

clone()  ⇒ collection

Copia todos los elementos de la colección mediante clonación profunda.

Este método no copia los datos ni los controladores de eventos a los nuevos elementos. Esto difiere de jQuery, que utiliza un parámetro para determinar si se copian los datos y los controladores de eventos.

closest

closest(selector, [context])  ⇒ collection
closest(collection)  ⇒ collection v1.0+
closest(element)  ⇒ collection v1.0+

Empieza desde el propio elemento, asciende nivel por nivel a los elementos ancestros y devuelve el primero que coincida con el selector. Si se proporciona el parámetro de nodo context, solo se comparan los descendientes de ese nodo. Este método esparents(selector)algo parecido, pero solo devuelve el primer ancestro que coincida.

Si el parámetro es una colección de objetos Zepto o un elemento, el resultado debe coincidir con el elemento dado, no con el selector.

var input = $('input[type=text]')
input.closest('form')

concat

concat(nodes, [node2, ...])  ⇒ self

Añade elementos a un objeto de colección Zepto formando un nuevo array. Si el argumento es un array, los elementos de ese array se fusionarán en el objeto de colección Zepto.

Este es un método proporcionado por Zepto, no una API de jQuery.

contents v1.0+

contents()  ⇒ collection

Obtiene los elementos hijos de cada elemento del conjunto coincidente, incluidos los nodos de texto y comentario. (Nota de Yuren Matou: .contents() y.children()son similares, solo que el primero incluye nodos de texto y los elementos HTML producidos en el objeto jQuery.)

css

css(property)  ⇒ value
css([property1, property2, ...])  ⇒ object v1.1+
css(property, value)  ⇒ self
css({ property: value, property2: value2, ... })  ⇒ self

Lee o establece propiedades CSS de elementos DOM. Cuando el parámetro value no existe, devuelve la propiedad CSS del primer elemento del conjunto. Cuando value existe, establece la propiedad CSS correspondiente en cada elemento del conjunto.

Se pueden obtener varias propiedades a la vez pasando un array de nombres de propiedades. Varias propiedades se pueden establecer mediante pares clave-valor en un objeto.

Cuando `value` está vacío (cadena vacía,nulloundefined), esa propiedad CSS será eliminada. Cuando el valor es un número sin unidades, si la propiedad CSS requiere unidades, 'px' se añadirá automáticamente a la propiedad.

var elem = $('h1')
elem.css('background-color')          // read property
elem.css('background-color', '#369')  // set property
elem.css('background-color', '')      // remove property

// set multiple properties:
elem.css({ backgroundColor: '#8EE', fontSize: 28 })

// read multiple properties:
elem.css(['backgroundColor', 'fontSize'])['fontSize']

data

data(name)  ⇒ value
data(name, value)  ⇒ self

Lee o escribe ladata-*propiedad del DOM. Se comporta de manera similar aattr, pero el nombre del atributo va precedido dedata-。

Al leer los valores de las propiedades, se aplican las siguientes conversiones:v1.0+

• "true", "false" y "null" se convierten a los tipos correspondientes;
• Los valores numéricos se convierten al tipo numérico real;
• Los valores JSON se parsearán si son JSON válido;
• Todo lo demás se devuelve como cadena.

  Zepto La implementación básica de `data()` solo puede almacenar cadenas. Si necesitas almacenar objetos arbitrarios, incluye el módulo opcional 'data' en tu compilación de Zepto.

each

each(function(index, item){ ... })  ⇒ self

Itera sobre cada elemento de un conjunto de objetos. En la función de iteración,thisla palabra clave apunta al elemento actual (pasado como segundo argumento a la función). Si la función de iteración devuelvefalse, finaliza la iteración.

$('form input').each(function(index){
  console.log('input %d is: %o', index, this)
})

empty

empty()  ⇒ self

Vacía el contenido DOM de cada elemento del conjunto de objetos.

eq

eq(index)  ⇒ collection

Obtiene el elemento del conjunto de objetos actual según el índice dado (nota de Yuren Matou: basado en 0).

$('li').eq(0)   //=> only the first list item
$('li').eq(-1)  //=> only the last list item

filter

filter(selector)  ⇒ collection
filter(function(index){ ... })  ⇒ collection v1.0+

Filtra el conjunto de objetos, devolviendo los elementos que cumplen el selector CSS. Si el argumento es una función, el elemento solo se devuelve cuando la función devuelve un valor verdadero. En la función,thisLa palabra clave `this` se refiere al elemento actual.

Para la función opuesta, consultanot.

find

find(selector)  ⇒ collection
find(collection)  ⇒ collection v1.0+
find(element)  ⇒ collection v1.0+

Busca, dentro del conjunto de objetos actual, los descendientes de cada elemento que coinciden con el selector CSS.

Si se da un objeto de colección Zepto o un elemento, se filtran; solo se devuelven si están en el objeto de colección Zepto actual.

var form = $('#myform')
form.find('input, select')

first

first()  ⇒ collection

Obtiene el primer elemento del conjunto de objetos actual.

$('form').first()

forEach

forEach(function(item, index, array){ ... }, [context]) 

Itera sobre cada elemento del conjunto de objetos, algo parecido a each, pero los parámetros de la función de iteración son diferentes; cuando la función devuelvefalsecuando ..., la iteración no se detiene.

Este es un método proporcionado por Zepto, no una API de jQuery.

get

get()  ⇒ array
get(index)  ⇒ DOM node

Obtiene todos los elementos o un solo elemento del conjunto de objetos actual. Cuando el parámetro index no existe, devuelve todos los elementos como un array normal. Cuando se especifica index, devuelve solo el elemento en esa posición. Esto es diferente deeqdiferente, este método devuelve nodos DOM, no un conjunto de objetos Zepto.

var elements = $('h2')
elements.get()   //=> get all headings as an array
elements.get(0)  //=> get first heading node

has v1.0+

has(selector)  ⇒ collection
has(node)  ⇒ collection

Determina si los elementos secundarios del conjunto de objetos actual tienen elementos que coinciden con el selector, o si contienen el nodo DOM especificado. Si es así, devuelve un nuevo conjunto de objetos que filtra los objetos que no contienen elementos que coinciden con el selector o que no contienen el nodo DOM especificado.

$('ol > li').has('a[href]')
//=> get only LI elements that contain links

hasClass

hasClass(name)  ⇒ boolean

Comprueba si algún elemento del conjunto de objetos tiene la clase especificada.

<ul>
    <li>list item 1</li>
    <li class="yaotaiyang">list item 2</li>
    <li>list item 3</li>
</ul>
<p>a paragraph</p>

<script type="text/javascript">
    $("li").hasClass("yaotaiyang");
  //=> true
</script>

height

height()  ⇒ number
height(value)  ⇒ self
height(function(index, oldHeight){ ... })  ⇒ self

Obtiene la altura del primer elemento del conjunto de objetos; o establece la altura de todos los elementos del conjunto de objetos.

$('#foo').height()   // => 123
$(window).height()   // => 838 (viewport height)
$(document).height() // => 22302

hide

hide()  ⇒ self

Hide elements in this collection by setting their display CSS property to none.

Al establecer la propiedad CSSdisplayParanonese ocultan los elementos del conjunto de objetos.

html

html()  ⇒ string
html(content)  ⇒ self
html(function(index, oldHtml){ ... })  ⇒ self

Obtiene o establece el contenido HTML de los elementos del conjunto de objetos. Cuando no se proporciona el parámetro content, devuelve el innerHtml del primer elemento del conjunto de objetos. Cuando se proporciona el parámetro content, lo usa para reemplazar el contenido de cada elemento del conjunto de objetos. content puede serappendtodos los tipos descritos en ...

// autolink everything that looks like a Twitter username
$('.comment p').html(function(idx, oldHtml){
  return oldHtml.replace(/(^|\W)@(\w{1,15})/g,
    '$1@<a href="http://twitter.com/$2">$2</a>')
})

index

index([element])  ⇒ number

Obtiene el valor de índice de un elemento (nota de Yuren Matou: el conteo comienza desde 0). Cuando no se proporciona el parámetro element, devuelve la posición del elemento actual entre sus nodos hermanos. Cuando se proporciona el parámetro element, devuelve su posición en el conjunto de objetos actual. Si no se encuentra el elemento, devuelve-1。

$('li:nth-child(2)').index()  //=> 1

indexOf

indexOf(element, [fromIndex])  ⇒ number

Get the position of an element in the current collection. If fromIndex number is given, search only from that position onwards. Returns the 0-based position when found and -1 if not found. Use of index is recommended over this method.

Obtiene el valor de índice de un elemento en el conjunto de objetos actual (nota de Yuren Matou: el conteo comienza desde 0). Si se proporciona el parámetro formindex, busca hacia adelante desde esa posición y devuelve el valor de índice basado en 0; si no lo encuentra, devuelve-1。indexEl método se implementa basándose en este método.

Este es un método de Zepto, no una API de jQuery.

insertAfter

insertAfter(target)  ⇒ self

Inserta los elementos del conjunto después del elemento objetivo especificado (nota de Yuren Matou: inserción externa). Esto es algo parecido a after, pero se usa de manera opuesta.

$('<p>Emphasis mine.</p>').insertAfter('blockquote')

insertBefore

insertBefore(target)  ⇒ self

Inserta los elementos del conjunto antes del elemento objetivo especificado (nota de Yuren Matou: inserción externa). Esto es algo parecido a before, pero se usa de manera opuesta.

$('<p>See the following table:</p>').insertBefore('table')

is

is(selector)  ⇒ boolean

Determina si el primer elemento del conjunto actual de elementos coincide con el selector de CSS. Para el soporte básico de los selectores no estándar de jQuery, como::visibleIncluido en el módulo opcional “selector”.

jQuery CSS extensionsNo es compatible. Seleccionar el módulo “selector” solo puede admitir unas pocas de las formas más comunes.

last

last()  ⇒ collection

Obtiene el último elemento del conjunto de objetos.

$('li').last()

map

map(function(index, item){ ... })  ⇒ collection

Itera sobre todos los elementos del conjunto de objetos. Se forma un nuevo conjunto de objetos con los valores de retorno de la función de iteración. En la función de iteraciónthisthis apunta al elemento actual del bucle (el segundo parámetro de la función de iteración).

return dentro del recorridonullyundefined, la iteración finalizará.

// get text contents of all elements in collection
elements.map(function(){ return $(this).text() }).get().join(', ')

next

next()  ⇒ collection
next(selector)  ⇒ collection v1.0+

Get the next sibling–optionally filtered by selector–of each element in the collection.

Obtiene el siguiente nodo hermano de cada elemento del conjunto de objetos (opcionalmente con un selector de filtro).

$('dl dt').next()   //=> the DD elements

not

not(selector)  ⇒ collection
not(collection)  ⇒ collection
not(function(index){ ... })  ⇒ collection

Filtra el conjunto de objetos actual para obtener un nuevo conjunto de objetos cuyos elementos no coinciden con el selector de CSS. Si el otro parámetro es un conjunto de objetos Zepto, entonces los elementos del nuevo objeto Zepto devuelto no están contenidos en ese objeto parámetro. Si el parámetro es una función, solo se incluyen los elementos para los cuales la función devuelve un valor falso. La funciónthisLa palabra clave `this` apunta al elemento actual del bucle.

Para la función opuesta, consultafilter.

offset

offset()  ⇒ object
offset(coordinates)  ⇒ self v1.0+
offset(function(index, oldOffset){ ... })  ⇒ self v1.0+

Obtiene la posición del elemento actual relativa al documento. Devuelve un objeto que contiene:top, left, widthyheight

cuando se proporciona uno que contieneleftytopCuando se proporciona un objeto de propiedades, usa esos valores para posicionar cada elemento del conjunto con respecto al documento.

offsetParent v1.0+

offsetParent()  ⇒ collection

Encuentra el primer elemento ancestro posicionado, lo que significa que su CSSpositionEl valor del atributo es “relative”, “absolute” o “fixed”

parent

parent([selector])  ⇒ collection

Obtiene el elemento padre directo de cada elemento del conjunto de objetos. Si se proporciona el parámetro selector de CSS, filtra los elementos que cumplen la condición.

parents

parents([selector])  ⇒ collection

Obtiene todos los elementos ancestros de cada elemento del conjunto de objetos. Si se proporciona el parámetro selector de CSS, filtra los elementos que cumplen la condición.

Si se quiere obtener el elemento padre directo, usaparent. Si solo se desea obtener el primer elemento que coincida con el selector de CSS, useclosest。

$('h1').parents()   //=> [<div#container>, <body>, <html>]

pluck

pluck(property)  ⇒ array

Obtiene el valor del atributo de cada elemento del conjunto de objetos. El valor de retorno esnulloundefinedque vale la pena filtrar.

$('body > *').pluck('nodeName') // => ["DIV", "SCRIPT"]

// implementation of Zepto's `next` method
$.fn.next = function(){
  return $(this.pluck('nextElementSibling'))
}

Este es un método de Zepto, no una API de jQuery.

position v1.0+

position()  ⇒ object

Obtiene la posición del primer elemento del conjunto de objetos. Relativa aoffsetParent. Cuando un elemento con posicionamiento absoluto está cerca de otro elemento, este método es útil.

Returns an object with properties: top, left.

var pos = element.position()

// position a tooltip relative to the element
$('#tooltip').css({
  position: 'absolute',
  top: pos.top - 30,
  left: pos.left
})

prepend

prepend(content)  ⇒ self

Inserta el contenido del parámetro antes de cada elemento coincidente (nota de Yuren Matou: inserción interna del elemento). Los elementos insertados pueden ser un fragmento de cadena HTML, un nodo DOM o un array de nodos.

$('ul').prepend('<li>first list item</li>')

prependTo

prependTo(target)  ⇒ self

Inserta todos los elementos antes del objetivo (nota de Yuren Matou: inserción interna del elemento). Esto es algo parecido aprepend, pero de la manera opuesta.

$('<li>first list item</li>').prependTo('ul')

prev

prev()  ⇒ collection
prev(selector)  ⇒ collection v1.0+

Obtiene el nodo hermano anterior de cada elemento del conjunto de objetos, filtrando con un selector.

prop v1.0+

prop(name)  ⇒ value
prop(name, value)  ⇒ self
prop(name, function(index, oldValue){ ... })  ⇒ self

Lee o establece el valor del atributo de un elemento DOM. Al leer valores de atributos, tiene prioridad sobreattr, porque estos valores de atributo pueden cambiar debido a la interacción del usuario, comocheckedyselected。

Nombres abreviados o en minúsculas, por ejemplofor, class, readonlyy atributos similares, se asignarán a las propiedades reales, por ejemplohtmlFor, className, readOnly, etc.

push

push(element, [element2, ...])  ⇒ self

Add elements to the end of the current collection.

Añade elementos al final del conjunto de objetos actual.

Este es un método de Zepto, no una API de jQuery.

ready

ready(function($){ ... })  ⇒ self

Añade un detector de eventos que se dispara cuando el DOM de la página ha terminado de cargarse y se dispara el evento “DOMContentLoaded”. Se recomienda usar$()para sustituir este uso.

reduce

reduce(function(memo, item, index, array){ ... }, [initial])  ⇒ value

yArray.reduceTiene el mismo uso, itera sobre el conjunto de objetos actual. memo es el valor de retorno de la función de la iteración anterior. Itera de forma progresiva.

Este es un método de Zepto, no una API de jQuery.

remove

remove()  ⇒ self

Elimina los elementos del conjunto actual de sus nodos padre, eliminándolos efectivamente del DOM.

removeAttr

removeAttr(name)  ⇒ self

Elimina el atributo especificado de todos los elementos del conjunto de objetos actual.

removeClass

removeClass([name])  ⇒ self
removeClass(function(index, oldClassName){ ... })  ⇒ self

Elimina la clase especificada de todos los elementos del conjunto de objetos actual. Si no se proporciona el parámetro name, se eliminarán todas las clases. Los nombres de varias clases pueden separarse con espacios. El siguiente ejemplo elimina dos clases.

<input class="taiyang yueliang" id="check1" type="checkbox" checked="checked">
<input class="yaotaiyang" id="check2" type="checkbox">

<script type="text/javascript">
    $("#check1").removeClass("taiyang yueliang")
    //=>[<input class id="check1" type="checkbox" checked="checked">]
</script>

replaceWith

replaceWith(content)  ⇒ self

Reemplaza todos los elementos coincidentes con el contenido dado. (Incluyendo los propios elementos). El parámetro content puede serbeforeel tipo descrito en.

scrollLeft v1.1+

scrollLeft()  ⇒ number
scrollLeft(value)  ⇒ self

Obtiene o establece el valor en píxeles del desplazamiento horizontal de un elemento desplazable de la página o de toda la ventana.

scrollTop v1.0+

scrollTop()  ⇒ number
scrollTop(value)  ⇒ self v1.1+

Obtiene o establece el valor en píxeles del desplazamiento vertical de un elemento desplazable de la página o de toda la ventana.

show

show()  ⇒ self

Restaura el valor “display” predeterminado de cada elemento del conjunto de objetos. Si usashidepara ocultar un elemento, puedes usar esta propiedad para mostrarlo. Es equivalente a eliminar eldisplay：none。

siblings

siblings([selector])  ⇒ collection

Obtiene los nodos hermanos de todos los elementos del conjunto de objetos. Si se proporciona un parámetro selector de CSS, filtra los elementos que coinciden con el selector.

size

size()  ⇒ number

Obtiene el número de elementos del conjunto de objetos.

slice

slice(start, [end])  ⇒ array

extraer este arrayarraysubconjunto de, desdestartcomenzando, si se proporcionaend, extraer de destartcomenzar aendel elemento final, pero no incluyeendel elemento en la posición.

text

text()  ⇒ string
text(content)  ⇒ self
text(function(index, oldText){ ... })  ⇒ self v1.1.4+

Obtiene o establece el contenido de texto de los elementos de todos los conjuntos de objetos. Cuando no se proporciona el parámetro content, devuelve el contenido de texto del primer elemento del conjunto de objetos actual (incluido el contenido de texto de los nodos hijos). Cuando se proporciona el parámetro content, lo usa para reemplazar el contenido de texto de todos los elementos del conjunto de objetos. Es algo similar ahtml, pero a diferencia de él, no se puede usar para obtener o establecer HTML.

toggle

toggle([setting])  ⇒ self

Muestra u oculta los elementos coincidentes. Sisettinges `true`, equivale ashowmétodo. Sisettinges `false`. Equivale ahidemétodo.

var input = $('input[type=text]')
$('#too_long').toggle(input.val().length > 140)

toggleClass

toggleClass(names, [setting])  ⇒ self
toggleClass(function(index, oldClassNames){ ... }, [setting])  ⇒ self

Añade o elimina una o más clases de estilo en cada elemento del conjunto de elementos coincidentes. Si el nombre de la clase existe, lo elimina; si no existe, lo añade. Sisettingsi el valor es verdadero, esta función es similar aaddClass, si es falso, esta función es similar aremoveClass。

unwrap

unwrap()  ⇒ self

Elimina el nodo padre directo de cada elemento del conjunto y conserva sus elementos secundarios en sus posiciones originales. Básicamente, este método elimina el ancestro inmediato mientras mantiene el elemento actual en el DOM.

$(document.body).append('<div id=wrapper><p>Content</p></div>')
$('#wrapper p').unwrap().parents()  //=> [<body>, <html>]

val

val()  ⇒ string
val(value)  ⇒ self
val(function(index, oldValue){ ... })  ⇒ self

Obtiene o establece el valor de los elementos coincidentes. Cuando no se proporciona el parámetro value, devuelve el valor del primer elemento. Si es una<select multiple>etiqueta, devuelve un array. Cuando se proporciona el parámetro value, se establecerá el valor de todos los elementos.

width

width()  ⇒ number
width(value)  ⇒ self
width(function(index, oldWidth){ ... })  ⇒ self

Obtiene el ancho del primer elemento del conjunto de objetos; o establece el ancho de todos los elementos del conjunto de objetos.

$('#foo').width()   // => 123
$(window).width()   // => 768 (viewport width)
$(document).width() // => 768 

wrap

wrap(structure)  ⇒ self
wrap(function(index){ ... })  ⇒ self v1.0+

Envuelve cada elemento coincidente con un elemento HTML externo. El parámetro structure puede ser un solo elemento o algunos elementos anidados. También puede ser un fragmento de cadena HTML o un nodo DOM. También puede ser una función de retorno que se utiliza para generar el envoltorio, que devuelve los dos primeros tipos de fragmentos envolventes.

Es importante señalar:Este método tiene un buen soporte para nodos en el DOM. Si sewrap()Si se usa en un elemento nuevo y luego el resultado se inserta en el `document`, el método no tiene efecto.

// wrap each button in a separate span:
$('.buttons a').wrap('<span>')

// wrap each code block in a div and pre:
$('code').wrap('<div class=highlight><pre /></div>')

// wrap all form inputs in a span with classname
// corresponding to input type:
$('input').wrap(function(index){
  return '<span class=' + this.type + 'field />'
})
//=> <span class=textfield><input type=text /></span>,
//   <span class=searchfield><input type=search /></span>

// WARNING: will not work as expected!
$('<em>broken</em>').wrap('<li>').appendTo(document.body)
// do this instead:
$('<em>better</em>').appendTo(document.body).wrap('<li>')

wrapAll

wrapAll(structure)  ⇒ self

Envuelve todos los elementos coincidentes en una sola estructura externa. La estructura puede ser un solo elemento o varios elementos anidados, y se puede pasar como una cadena HTML o un nodo DOM.

// wrap all buttons in a single div:
$('a.button').wrapAll('<div id=buttons />')

wrapInner

wrapInner(structure)  ⇒ self
wrapInner(function(index){ ... })  ⇒ self v1.0+

de cada elementoContenidoEnvuelve en una sola estructura. La estructura puede ser un solo elemento o varios elementos anidados, y se puede pasar como una cadena HTML o un nodo DOM, o puede ser una función de retorno que se utiliza para generar el envoltorio, que devuelve los dos primeros tipos de fragmentos envolventes.

// wrap the contents of each navigation link in a span:
$('nav a').wrapInner('<span>')

// wrap the contents of each list item in a paragraph and emphasis:
$('ol li').wrapInner('<p><em /></p>')

Detect module

Este método de detección puede ajustar tu sitio o aplicación en diferentes entornos y te ayuda a identificar teléfonos y tabletas; así como diferentes navegadores y sistemas operativos.

// The following boolean flags are set to true if they apply,
// if not they're either set to `false` or `undefined`.
// We recommend accessing them with `!!` prefixed to coerce to a boolean. 

// general device type
$.os.phone
$.os.tablet

// specific OS
$.os.ios
$.os.android
$.os.webos
$.os.blackberry
$.os.bb10
$.os.rimtabletos

// specific device type
$.os.iphone
$.os.ipad
$.os.ipod // [v1.1]
$.os.touchpad
$.os.kindle

// specific browser
$.browser.chrome
$.browser.firefox
$.browser.safari // [v1.1]
$.browser.webview // (iOS) [v1.1]
$.browser.silk
$.browser.playbook
$.browser.ie // [v1.1]

// 此外，版本信息是可用的。
// 下面是运行​​iOS 6.1的iPhone所返回的。
!!$.os.phone         // => true
!!$.os.iphone        // => true
!!$.os.ios           // => true
$.os.version       // => "6.1"
$.browser.version  // => "536.26"

$.Event

$.Event(type, [properties])  ⇒ event

Crea e inicializa un evento DOM especificado. Si se proporciona un objeto properties, se usa para extender el nuevo objeto de evento. De forma predeterminada, el evento se establece en modo burbuja; esto se puede configurar mediantebubblesParafalsepara cerrar.

Una función de inicialización de eventos puede usartriggerpara activar.

$.Event('mylib:change', { bubbles: false })

$.proxy v1.0+

$.proxy(fn, context)  ⇒ function
$.proxy(fn, context, [additionalArguments...])  ⇒ function v1.1.4+
$.proxy(context, property)  ⇒ function
$.proxy(context, property, [additionalArguments...])  ⇒ function v1.1.4+

Acepta una función y devuelve una nueva función, y esta nueva función siempre mantiene un contexto específico. En la nueva funciónthisapunta al parámetro context. En otra forma, la función original se lee desde una propiedad específica del objeto de contexto.

Si se pasan más de 2 argumentos adicionales, se utilizan como argumentos para la función pasada al parámetro fn.

var obj = {name: 'Zepto'},
    handler = function(){ console.log("hello from + ", this.name) }

// ensures that the handler will be executed in the context of `obj`:
$(document).on('click', $.proxy(handler, obj))

bind 🐶🔫

No recomendado, useonreemplazar.

bind(type, function(e){ ... })  ⇒ self
bind(type, [data], function(e){ ... })  ⇒ self v1.1+
bind({ type: handler, type2: handler2, ... })  ⇒ self
bind({ type: handler, type2: handler2, ... }, [data])  ⇒ self v1.1+

para enlazar un controlador de eventos a un elemento.

delegate 🐶🔫

No recomendado, useonreemplazar.

delegate(selector, type, function(e){ ... })  ⇒ self
delegate(selector, { type: handler, type2: handler2, ... })  ⇒ self

Adjunta un manejador de eventos a todos los elementos que coinciden con el selector, basándose en un conjunto específico de elementos raíz; los elementos coincidentes pueden crearse ahora o en el futuro.

die 🐶🔫

No recomendado, useonreemplazar.

die(type, function(e){ ... })  ⇒ self
die({ type: handler, type2: handler2, ... })  ⇒ self

eliminar medianteliveel evento agregado.

event.isDefaultPrevented v1.1+

event.isDefaultPrevented()  ⇒ boolean

SipreventDefault()Si la instancia del evento lo invoca, devuelve `true`. Esto puede servir como una alternativa multiplataforma al nativo defaultPreventedatributo, si defaultPreventedCuando falta o no es fiable en algunos navegadores.

// trigger a custom event and check whether it was cancelled
var event = $.Event('custom')
element.trigger(event)
event.isDefaultPrevented()

event.isImmediatePropagationStopped v1.1+

event.isImmediatePropagationStopped()  ⇒ boolean

SistopImmediatePropagation()Si la instancia del evento lo invoca, devuelve `true`. Zepto lo implementa en navegadores que no soportan este método nativo,

event.isPropagationStopped v1.1+

event.isPropagationStopped()  ⇒ boolean

SistopPropagation()Si la instancia del evento lo invoca, devuelve `true`.

live 🐶🔫

No recomendado, useonreemplazar.

live(type, function(e){ ... })  ⇒ self
live({ type: handler, type2: handler2, ... })  ⇒ self

similardelegateAgrega un manejador de eventos a todos los elementos que coinciden con el selector actual; los elementos coincidentes pueden crearse ahora o en el futuro.

off

off(type, [selector], function(e){ ... })  ⇒ self
off({ type: handler, type2: handler2, ... }, [selector])  ⇒ self
off(type, [selector])  ⇒ self
off()  ⇒ self

quitar medianteonEl evento agregado. Para eliminar un manejador de eventos específico, debe usaron()la misma función que se agregó. De lo contrario, llamar a este método solo con el tipo de evento eliminará todos los manejadores de ese tipo. Si no hay parámetros, eliminará los manejadores del elemento actual.todoel evento registrado de.

on

on(type, [selector], function(e){ ... })  ⇒ self
on(type, [selector], [data], function(e){ ... })  ⇒ self v1.1+
on({ type: handler, type2: handler2, ... }, [selector])  ⇒ self
on({ type: handler, type2: handler2, ... }, [selector], [data])  ⇒ self v1.1+

Agrega manejadores de eventos a los elementos de la colección de objetos. Se pueden agregar varios eventos mediante una cadena separada por espacios, o mediante un objeto con los tipos de evento como claves y funciones como valores. Si se proporciona un selector de CSS, el evento solo se activará cuando se origine en un elemento que coincida con ese selector (nota de 愚人码头: es decir, delegación de eventos, o proxy de eventos).

Si se proporcionadataParámetro, este valor se utilizará como `event.data` durante la ejecución del manejador de eventos. event.data Atributo

El manejador de eventos se ejecuta en el contexto del elemento en el que se agregó el manejador o, si se proporciona un selector, en el contexto del elemento que coincide con ese selector (nota de 愚人码头: `this` apunta al elemento que desencadenó el evento).false，preventDefault()ystopPropagation()En el caso de que sea llamado por el evento actual, se evitará la acción predeterminada del navegador, como los enlaces.

SifalseAl pasarlo como argumento en la posición de la función de callback a este método, equivale a pasar una función que devuelve directamente `false`.false. (Nota de Yuren Matou: seráfalsecomofunction(e){ ... }los parámetros de, comofunction(){ return false; }la forma abreviada de ..., por ejemplo:$("a.disabled").on("click", false);Esto equivale a$("a.disabled").on("click", function(){ return false; } );）

var elem = $('#content')
// observe all clicks inside #content:
elem.on('click', function(e){ ... })
// observe clicks inside navigation links in #content
elem.on('click', 'nav a', function(e){ ... })
// all clicks inside links in the document
$(document).on('click', 'a', function(e){ ... })
// disable following any navigation link on the page
$(document).on('click', 'nav a', false)

one

one(type, [selector], function(e){ ... })  ⇒ self
one(type, [selector], [data], function(e){ ... })  ⇒ self v1.1+
one({ type: handler, type2: handler2, ... }, [selector])  ⇒ self
one({ type: handler, type2: handler2, ... }, [selector], [data])  ⇒ self v1.1+

Agrega un manejador de eventos al elemento; después de la primera ejecución del evento, el evento se desvincula automáticamente, garantizando que la función de manejo se ejecute como máximo una vez en cada elemento.selectorydataConsulta la descripción de parámetros, etc..on()。

trigger

trigger(event, [args])  ⇒ self

Dispara el evento especificado en los elementos de la colección de objetos. El evento puede ser de tipo cadena, o un$.Eventobjeto de evento definido. Si se proporciona el argumento `args`, se pasará como argumento a la función de evento.

// add a handler for a custom event
$(document).on('mylib:change', function(e, from, to){
  console.log('change on %o with data %s, %s', e.target, from, to)
})
// trigger the custom event
$(document.body).trigger('mylib:change', ['one', 'two'])

Zepto solo admite disparar eventos en elementos DOM.

triggerHandler

triggerHandler(event, [args])  ⇒ self

comotriggersolo dispara el evento en el elemento actual, pero no burbujea.

        $("input").triggerHandler('focus');
        // 此时input上的focus事件触发，但是input不会获取焦点
        $("input").trigger('focus');
        // 此时input上的focus事件触发，input获取焦点

unbind 🐶🔫

Deprecated, use off instead.

unbind(type, function(e){ ... })  ⇒ self
unbind({ type: handler, type2: handler2, ... })  ⇒ self

quitar mediantebindel evento registrado.

undelegate 🐶🔫

Deprecated, use off instead.

undelegate(selector, type, function(e){ ... })  ⇒ self
undelegate(selector, { type: handler, type2: handler2, ... })  ⇒ self

quitar mediantedelegateel evento registrado.

$.ajax

$.ajax(options)  ⇒ XMLHttpRequest

Ejecuta una solicitud Ajax. Puede ser un recurso local, o mediante el soporte deHTTP access controlnavegadores que lo admiten, o medianteJSONPpara implementar cross-domain.

Opciones:

• type(por defecto: “GET”): método de solicitud (“GET”, “POST”, u otro)
• url(predeterminado: dirección actual): la dirección a la que se envía la solicitud.
• data(predeterminado: none): datos enviados al servidor; si es una solicitud GET, se agregarán automáticamente como parámetros a la URL. Los objetos que no sean String se convertirán mediante$.paramObtiene la cadena serializada.
• processData(predeterminado: true): para solicitudes que no sean GET. Si se deben convertir automáticamentedataconvertir a string.
• contentType(predeterminado: “application/x-www-form-urlencoded”): tipo de codificación de contenido al enviar información al servidor. (Esto también se puede configurar medianteheaders). Al establecerfalseOmite el establecimiento del valor predeterminado.
• mimeType(predeterminado: none): anula el tipo MIME de la respuesta.v1.1+
• dataType(por defecto: none): el tipo de datos que se espera que devuelva el servidor ("json", "jsonp", "xml", "html" o "text")
• jsonp(predeterminado: “callback”): nombre del parámetro de consulta de la devolución de llamada JSONP.
• jsonpCallback(predeterminado: “jsonp{N}”): nombre de la cadena (o de una función que la devuelve) de la función de devolución de llamada JSONP global. Establecer este elemento puede habilitar la caché del navegador.v1.1+
• timeout(por defecto:0): tiempo de espera de la solicitud en milisegundos,0indica que no hay timeout.
• headers: objeto de encabezados HTTP adicionales en la solicitud Ajax.
• async(predeterminado: true): de forma predeterminada, todas las solicitudes son asíncronas. Si necesita enviar una solicitud síncrona, establezca esto enfalse。
• global(predeterminado: true): la solicitud activará los manejadores de eventos globales de Ajax; establecerlo en `false` no activará los eventos globales de Ajax.
• context(predeterminado: `window`): este objeto se usa para establecer el contexto (`this`) de las funciones de devolución de llamada relacionadas con Ajax.
• traditional(predeterminado: false): activa el modo tradicional mediante$.parampara obtener el serializadodata。
• cache(predeterminado: true): si el navegador debe permitir el almacenamiento en caché de las respuestas GET. Desdev1.1.4en adelante, cuando la opción dataType sea "script"ojsonpcuando, el valor por defecto esfalse。
• xhrFields(predeterminado: none): un objeto cuyas propiedades se copian literalmente en la instancia de XMLHttpRequest.v1.1+
• username & password(predeterminado: none): credenciales de autenticación básica HTTP.v1.1+

Si la URL contiene=?odataTypees “jsonp”, esta solicitud se realizará mediante la inyección de un<script>etiqueta en lugar de usar XMLHttpRequest (verJSONP). En este puntocontentType, dataType, headersHay restricciones,asyncno es compatible.

Funciones de devolución de llamada de Ajax

Puede especificar las siguientes funciones de devolución de llamada, que se ejecutarán en el orden dado:

1. beforeSend(xhr, settings): llamado antes de enviar la solicitud; recibe el objeto `xhr` y `settings` como argumentos. Si devuelvefalse, la petición será cancelada.

2. success(data, status, xhr): llamado después de que la solicitud tenga éxito. Recibe los datos devueltos y una cadena que contiene el código de éxito.

3. error(xhr, errorType, error): llamado cuando la solicitud falla. (tiempo de espera, error de análisis, o código de estado que no está en HTTP 2xx).

4. complete(xhr, status): llamado cuando la solicitud se completa, ya sea que falle o tenga éxito.

Interfaz de devolución de llamada de Promisev1.1+

Si los módulos opcionales "callbacks" y "deferred" se cargan, desde$.ajax()El objeto XHR devuelto implementa la interfaz promise para callbacks en cadena:

xhr.done(function(data, status, xhr){ ... })
xhr.fail(function(xhr, errorType, error){ ... })
xhr.always(function(){ ... })
xhr.then(function(){ ... })

Estos métodos reemplazan asuccess, error, ycompleteOpciones de callback.

Eventos Ajax

Cuandoglobal: trueCuando... En el ciclo de vida de la solicitud Ajax, se activarán los siguientes eventos.

1. ajaxStart (global): se activará si no hay otras solicitudes Ajax activas en ese momento.

2. ajaxBeforeSend(data: xhr, options): antes de enviar la solicitud, se puede cancelar.

3. ajaxSend(data: xhr, options): comoajaxBeforeSend, pero no se puede cancelar.

4. ajaxSuccess(data: xhr, options, data): cuando se devuelve correctamente.

5. ajaxError(data: xhr, options, error): cuando hay un error.

6. ajaxComplete(data: xhr, options): se activa después de que la solicitud se haya completado, ya sea que haya tenido éxito o haya fallado.

7. ajaxStop (global): se activará si esta es la última solicitud Ajax activa.

De forma predeterminada, los eventos Ajax se activan en el objeto `document`. Sin embargo, si elcontextes un nodo DOM, el evento se activará en este nodo y luego burbujeará en el DOM. La única excepción esajaxStart & ajaxStopEstos dos eventos globales.

$(document).on('ajaxBeforeSend', function(e, xhr, options){
  // This gets fired for every Ajax request performed on the page.
  // The xhr object and $.ajax() options are available for editing.
  // Return false to cancel this request.
})

$.ajax({
  type: 'GET',
  url: '/projects',
  // data to be added to query string:
  data: { name: 'Zepto.js' },
  // type of data we are expecting in return:
  dataType: 'json',
  timeout: 300,
  context: $('body'),
  success: function(data){
    // Supposing this JSON payload was received:
    //   {"project": {"id": 42, "html": "<div>..." }}
    // append the HTML to context object.
    this.append(data.project.html)
  },
  error: function(xhr, type){
    alert('Ajax error!')
  }
})

// post a JSON payload:
$.ajax({
  type: 'POST',
  url: '/projects',
  // post payload:
  data: JSON.stringify({ name: 'Zepto.js' }),
  contentType: 'application/json'
})

$.ajaxJSONP 🐶🔫

No recomendado, use$.ajaxreemplazar.

$.ajaxJSONP(options)  ⇒ mock XMLHttpRequest

Ejecuta JSONP para obtener datos entre dominios.

Este método es relativo$.ajaxNo tiene ventajas; se recomienda no usarlo.

$.ajaxSettings

un objeto que contiene la configuración predeterminada de las solicitudes Ajax. La mayoría de las configuraciones se describen en$.ajaxya se han descrito. Los siguientes ajustes son muy útiles a nivel global:

• timeout(por defecto:0): establece un valor distinto de cero para especificar un tiempo de espera predeterminado para las solicitudes Ajax, en milisegundos.
• global(predeterminado: true): establézcalo en `false` para evitar que se activen los eventos Ajax.
• xhr(predeterminado: XMLHttpRequest factory): se establece como una función que devuelve una instancia de XMLHttpRequest (o un objeto compatible).
• accepts: el tipo MIME solicitado al servidor; especificadataTypeValor:
  • script: “text/javascript, application/javascript”
  • json: “application/json”
  • xml: “application/xml, text/xml”
  • html: “text/html”
  • text: “text/plain”

$.get

$.get(url, function(data, status, xhr){ ... })  ⇒ XMLHttpRequest
$.get(url, [data], [function(data, status, xhr){ ... }], [dataType])  ⇒ XMLHttpRequest v1.0+

Ejecuta una solicitud Ajax GET. Esta es una$.ajaxla forma abreviada de.

$.get('/whatevs.html', function(response){
  $(document.body).append(response)
})

$.getJSON

$.getJSON(url, function(data, status, xhr){ ... })  ⇒ XMLHttpRequest
$.getJSON(url, [data], function(data, status, xhr){ ... })  ⇒ XMLHttpRequest v1.0+

Obtiene datos JSON mediante una solicitud Ajax GET. Esta es una$.ajaxla forma abreviada de.

$.getJSON('/awesome.json', function(data){
  console.log(data)
})

// fetch data from another domain with JSONP
$.getJSON('//example.com/awesome.json?callback=?', function(remoteData){
  console.log(remoteData)
})

$.param

$.param(object, [shallow])  ⇒ string
$.param(array)  ⇒ string

Serializa un objeto para representar los datos enviados en una solicitud Ajax como una cadena de consulta codificada en URL. Si `shallow` se establece en `true`, los objetos anidados no se serializarán y los valores de matrices anidadas no usarán corchetes en sus claves.

Si el valor de alguna propiedad de un objeto es una función, en lugar de una cadena, se llamará a esa función y su valor de retorno será serializado.

Además, también aceptaserializeArrayun arreglo con el formato en el que cada elemento tiene las propiedades “name” y “value”.

$.param({ foo: { one: 1, two: 2 }})
//=> "foo[one]=1&foo[two]=2)"

$.param({ ids: [1,2,3] })
//=> "ids[]=1&ids[]=2&ids[]=3"

$.param({ ids: [1,2,3] }, true)
//=> "ids=1&ids=2&ids=3"

$.param({ foo: 'bar', nested: { will: 'not be ignored' }})
//=> "foo=bar&nested[will]=not+be+ignored"

$.param({ foo: 'bar', nested: { will: 'be ignored' }}, true)
//=> "foo=bar&nested=[object+Object]"

$.param({ id: function(){ return 1 + 2 } })
//=> "id=3"

$.post

$.post(url, [data], function(data, status, xhr){ ... }, [dataType])  ⇒ XMLHttpRequest

Ejecuta una solicitud Ajax POST. Esta es una$.ajaxla forma abreviada de.

$.post('/create', { sample: 'payload' }, function(response){
  // process response
})

dataEl parámetro puede ser una cadena:

$.post('/create', $('#some_form').serialize(), function(response){
  // ...
})

load

load(url, function(data, status, xhr){ ... })  ⇒ self

Carga código HTML remoto mediante GET Ajax y lo inserta en la colección actual. Además, se puede especificar un selector CSS en la URL; de esta manera, el contenido HTML que coincide con el selector se puede usar para actualizar la colección.

$('#some_element').load('/foo.html #bar')

Si no se proporciona un selector CSS, se utilizará el texto completo devuelto.

Tenga en cuenta que, sin un selector, cualquier bloque de JavaScript se ejecutará. Si se incluye un selector, los `script` dentro del elemento que coincide con el selector se eliminarán.

serialize

serialize()  ⇒ string

Compila los valores de los elementos de formulario que se enviarán en una solicitud POST Ajax en una cadena codificada en URL.

serializeArray

serializeArray()  ⇒ array

Compila los valores de los elementos de formulario que se enviarán en un arreglo que tienenameyvalueUn array compuesto por objetos. Los elementos de formulario que no se pueden usar, botones, radio buttons/checkboxes no seleccionados serán omitidos. El resultado no incluye los datos de los file inputs.

$('form').serializeArray()
//=> [{ name: 'size', value: 'micro' },
//    { name: 'name', value: 'Zepto' }]

submit

submit()  ⇒ self
submit(function(e){ ... })  ⇒ self

Vincula una función de manejo al evento “submit”, o dispara el evento “submit” en el elemento. Cuando no se proporciona el parámetro `function`, se dispara el evento “submit” del formulario actual y se ejecuta el comportamiento predeterminado de envío del formulario, a menos que se llame apreventDefault()。

Cuando se proporciona el parámetro `function`, simplemente vincula una función de manejo al evento “submit” en el elemento actual.

$.fx

Configuración global de animaciones:

• $.fx.off(el valor predeterminado es `false` en navegadores que admiten transiciones CSS): establezca `true` para deshabilitar todasanimate() transitions.

• $.fx.speeds: el objeto que se usa para establecer la duración de la animación.

  • _default (400 ms)
  • fast (200 ms)
  • slow (600 ms)

cambiar un valor existente o agregar una nueva propiedad para afectar las animaciones que utilizan una cadena para establecer el tiempo.

animate

animate(properties, [duration, [easing, [function(){ ... }]]])  ⇒ self
      animate(properties, { duration: msec, easing: type, complete: fn })  ⇒ self
      animate(animationName, { ... })  ⇒ self
  

Realiza una transición suave de las propiedades de transición CSS en los elementos de la colección de objetos actual.

• properties: un objeto que contiene los valores de la animación CSS o el nombre de la animación de fotogramas CSS.
• duration(predeterminado: 400): tiempo en milisegundos, o una cadena.
  • fast (200 ms)
  • slow (600 ms)
  • Cualquier$.fx.speedsPropiedad personalizada
• easing(por defectolinear): especifica el tipo de easing de la animación, utiliza uno de los siguientes:
  • ease
  • linear
  • ease-in / ease-out
  • ease-in-out
  • cubic-bezier(...)
• complete: la función de devolución de llamada al completarse la animación.
li>delay: tiempo de retraso de transición en milisegundosv1.1+

Zepto también soporta lo siguienteCSS transformPropiedad:

• translate(X|Y|Z|3d)
• rotate(X|Y|Z|3d)
• scale(X|Y|Z)
• matrix(3d)
• perspective
• skew(X|Y)

Si el parámetro `duration` es0o$.fx.offsi es `true` (el valor predeterminado es `true` en navegadores que no admiten transiciones CSS), la animación no se ejecutará; en su lugar, la posición objetivo del efecto de animación se aplicará de inmediato. De manera similar, si la animación especificada no se completa mediante animación, sino que la posición objetivo de la animación se aplica de inmediato. En este caso, no hay animación,completeel método tampoco será invocado.

Si el primer argumento es una cadena en lugar de un objeto, se tratará como una animación de fotogramas clave CSS.CSS keyframe animationel nombre de.

$("#some_element").animate({
        opacity: 0.25,
        left:
        '50px',
        color:
        '#ABCDEF',
        rotateZ:
        '45deg',
        translate3d: '0,10px,0'
        }, 500,
        'ease-out')
    

Zepto solo utiliza animaciones con efectos de transición CSS. Los easings de jQuery no son compatibles. La sintaxis de cambios relativos de jQuery ("=+10px") tampoco es compatible. Consultelist of animatable properties. El soporte del navegador puede variar, así que asegúrese de probar los navegadores que desea admitir.

Touch events

El módulo "touch" añade los siguientes eventos, que se pueden utilizaronyoff。

• tap— se dispara cuando se hace tap en el elemento.
• singleTap and doubleTap— Este par de eventos se puede utilizar para detectar clics y dobles clics en un elemento. (Si no necesitas detectar clics o dobles clics, utilizatapen su lugar).
• longTap— Se dispara cuando un elemento se mantiene presionado durante más de 750 ms.
• swipe, swipeLeft, swipeRight, swipeUp, swipeDown— Se dispara cuando se desliza sobre un elemento. (Se puede elegir una dirección dada)

Estos eventos también son métodos abreviados en todas las colecciones de objetos Zepto.

<style>.delete { display: none; }</style>

<ul id=items>
  <li>List item 1 <span class=delete>DELETE</span></li>
  <li>List item 2 <span class=delete>DELETE</span></li>
</ul>

<script>
// show delete buttons on swipe
$('#items li').swipe(function(){
  $('.delete').hide()
  $('.delete', this).show()
})

// delete row on tapping delete button
$('.delete').tap(function(){
  $(this).parent('li').remove()
})
</script>