Un ejemplo típico de yepnope.js :
yepnope ({test: modernizr.geolocation, sí: 'normal.js', no: ['polyFill.js', 'wrapper.js']});Este ejemplo significa que si Modernizr.Geolocation es verdadero, Normal.js está cargado, se cargan polyfill.js y wrapper.js.
Yepnope sintaxis completa :
yepnope ([{test: /* boolean (ish) Ingrese la condición* /, yep: /* array (de cadenas) | cadena - recursos cargados cuando la condición es verdadera* /, nope: /* array (array (de cadenas) | cadena - recursos cargados cuando la condición es falsa* /, ambas:* Array (de las cuerdas) | Streds - Recursos cargados cuando la condición es la condición es la condición de la condición es la condición: la carga: cargada: la condición) Cargado cuando la condición es verdadera y falsa*/, devolución de llamada:/*function (testResult, key) |Por qué usar Yepnope :
Solo 1.6k después de que GZIP sea más pequeño que la mayoría de los cargadores de recursos
Puede cargar CSS y JS
Yepnope pasa pruebas para todos los navegadores que el autor puede encontrar
Yepnope separa completamente la carga y la ejecución de los recursos, por lo que puede controlar el orden de la ejecución de recursos
Proporciona una combinación lógica de API amistosas y facilita los recursos
Diseño modular, puede expandir sus propias funciones (consulte los prefijos y los filtros más tarde)
Fomentar la carga de recursos a pedido
Integrado en Modernizr
Por defecto, siempre se ejecuta en el orden de la lista de recursos (el orden de la lista de archivos que proporciona)
Puede manejar fallas de recursos y aún prioriza la descarga de scripts dependientes en paralelo. Es más fácil de entender después de leer el código:
yepnope ([{Load: 'http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js', completo: function () {if (! Window.jquery) {yepnope ('local/jQuery.min.js');}}}, {Load: { 'jQuery.plugin.js', completo: function () {jQuery (function () {jQuery ('div') .plugin ();});Otros cargadores pueden tener que manejar esto:
someloader ('http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js', function () {if (! Window.jquery) {sateloader ('local/jquery.min.js', 'jquery.plugin.js');/*Note la diferencia y la diferencia entre esto y y y y y y y y y y y sí Yepnope no se carga, solo necesita volver a cargar el recurso de copia de seguridad, que no afectará la ejecución de otros archivos que dependen de este recurso*/} else {someloader ('jquery.plugin.js');Las deficiencias de Yepnope
No siempre es el más rápido, como los LABJ, etc., puede cargarse más rápido que Yepnope después de la optimización, pero debe considerar qué cargador usar de acuerdo con su situación real.
Debe establecer ciertos encabezados de caché para el recurso (esto es muy importante)
A diferencia de los JEInsjs y otras bibliotecas de clase que tienen sus propias herramientas de generación y API ricas, Yepnope solo implementa la función de cargador básico.
Por defecto, siempre se ejecuta en el orden de la lista de recursos que proporciona, lo que puede afectar la velocidad
Ejemplo de uso de Yepnope :
Pasando en una cuerda directamente
yepnope ('/url/to/your/script.js');Pase en un objeto de objeto
yepnope ({load: '/url/to/your/script.js'});Instancia de función de devolución de llamada (URL en la función de devolución de llamada representa el nombre del archivo de recurso cargado; el resultado representa el resultado del parámetro de prueba; la clave representa la abreviatura del nombre del archivo al usar la asignación de clave)
yepnope ({test: window.json, load: '/url/to/your/script.js', llamado: function (url, resultado, key) {// Cuando esto se ejecuta, su script acaba de ejecutar. Alert ('script.js ha cargado!');}});Ejemplo de función completa
yepnope ({test: window.json, nope: 'json2.js', completa: function () {var data = window.json.parse ('{"json": "string"}');}});Instancia de mapeo de clave
yepnope ({test: modernizr.Geolocation, yep: {'rstyles': 'regular-styles.css'}, nope: {'mstyles': 'modificado-styles.css', 'geopoly': 'geolocation-polyfill.js'}, llamado: function (url, resultado, key) {if (((key === 'Este es el polyfill de geolocalización!'Por supuesto, también puede escribir la función de devolución de llamada así:
yepnope ({test: modernizr.Geolocation, yep: {'rstyles': 'regular-styles.css'}, nope: {'mstyles': 'modificado-styles.css', 'geopoly': 'geolocation-polyfill.js'}, llamado: {'rstyles': function (function (url, that ('»that ('» that ('»thats °) estilos!3 prefijos proporcionados por Yepnope
CSS! Prefijo: cualquier archivo con sufijo se puede cargar como un archivo CSS
yepnope ('css! mystyles.php? versión = 1532');¡Prepara! Prefijo: precarga el recurso en el caché, pero no ejecute (ejecutarlo la próxima vez que lo cargue)
yepnope ({load: 'preload! jQuery.1.5.0.js', callback: function (url, resultado, key) {window.jquery; // undefined yepnope (jquery.1.5.0.js); window.jquery; // objeto}});¡es decir! Prefijo (es): Determine si el navegador IE (¡además de IE!, También es compatible con IE5, IE6, IE7, IE8, IE9, IEGT5, IEGT6, IEGT7, IEGT8, IELT7, IELT8 e IELT9)
yepnope ({load: ['normal.js', 'ie6! ie7! ie-patch.js'] // ie6 o ie7 solamente (en parche)});