Herramientas de usuario
wiki2:js_dom
Diferencias
Muestra las diferencias entre dos versiones de la página.
| Ambos lados, revisión anterior Revisión previa Próxima revisión | Revisión previa | ||
|
wiki2:js_dom [2019/02/19 13:41] alfred [Eventos] |
wiki2:js_dom [2020/05/09 09:25] (actual) |
||
|---|---|---|---|
| Línea 1: | Línea 1: | ||
| ====== Lets avoid jQuery ====== | ====== Lets avoid jQuery ====== | ||
| + | * https://htmldom.dev/ | ||
| * http://youmightnotneedjquery.com/ | * http://youmightnotneedjquery.com/ | ||
| + | * https://github.com/nefe/You-Dont-Need-jQuery | {{:wiki2:js:you-dont-need-jquery-master.zip|}} | ||
| + | * https://news.ycombinator.com/item?id=19534060 | ||
| + | ===== Vanilla ===== | ||
| + | |||
| + | Foreach: | ||
| + | <code> | ||
| + | the_array.forEach(function(element) { | ||
| + | console.log(element); | ||
| + | }); | ||
| + | </code> | ||
| + | |||
| + | ===== Typical jQuery ===== | ||
| + | OnDocumentLoad: | ||
| + | <code> | ||
| + | (function() { | ||
| + | // your page initialization code here | ||
| + | // the DOM will be available here | ||
| + | })(); | ||
| + | </code> | ||
| + | If supported, it tries the standard: | ||
| + | <code>document.addEventListener('DOMContentLoaded', fn, false);</code> | ||
| + | with a fallback to: | ||
| + | <code> | ||
| + | window.addEventListener('load', fn, false ) | ||
| + | </code> | ||
| + | or for older versions of IE, it uses: | ||
| + | <code> | ||
| + | document.attachEvent("onreadystatechange", fn); | ||
| + | </code> | ||
| + | with a fallback to: | ||
| + | <code> | ||
| + | window.attachEvent("onload", fn); | ||
| + | </code> | ||
| ===== Selectores ===== | ===== Selectores ===== | ||
| Línea 38: | Línea 72: | ||
| ===== Eventos ===== | ===== Eventos ===== | ||
| Add event: '' document.getElementById('the_id').setAttribute('onchange', 'javascript:loadElements(this, event);');'' | Add event: '' document.getElementById('the_id').setAttribute('onchange', 'javascript:loadElements(this, event);');'' | ||
| + | |||
| + | ==== Bloquear ==== | ||
| + | <code javascript> | ||
| + | function filterKeys(ctrl, event) { | ||
| + | if (event.key === ',') event.preventDefault(); | ||
| + | } | ||
| + | <input type="text" value="tralara" width="100px" onkeydown="filterKeys(this, event)" /> | ||
| + | </code> | ||
| + | |||
| + | Also: ''event.stopPropagation()'' | ||
| ===== Propiedades ===== | ===== Propiedades ===== | ||
| Línea 61: | Línea 105: | ||
| ===== Requests ===== | ===== Requests ===== | ||
| <code> | <code> | ||
| - | var request = new XMLHttpRequest(); | + | var request = new XMLHttpRequest(); |
| request.open('GET', url, true); | request.open('GET', url, true); | ||
| request.onload = function() { | request.onload = function() { | ||
| Línea 71: | Línea 115: | ||
| } | } | ||
| }; | }; | ||
| + | request.send(); | ||
| </code> | </code> | ||
wiki2/js_dom.1550583692.txt.gz · Última modificación: 2020/05/09 09:24 (editor externo)
Herramientas de la página
Excepto donde se indique lo contrario, el contenido de este wiki esta bajo la siguiente licencia: CC Attribution-Noncommercial-Share Alike 4.0 International
