diff options
Diffstat (limited to 'files/es/web/html/elemento/script/index.html')
-rw-r--r-- | files/es/web/html/elemento/script/index.html | 255 |
1 files changed, 255 insertions, 0 deletions
diff --git a/files/es/web/html/elemento/script/index.html b/files/es/web/html/elemento/script/index.html new file mode 100644 index 0000000000..d1b744f192 --- /dev/null +++ b/files/es/web/html/elemento/script/index.html @@ -0,0 +1,255 @@ +--- +title: <script> +slug: Web/HTML/Elemento/script +tags: + - Elemento + - HTML + - HTML scripting + - Referencia + - Scripting + - Web + - etiqueta +translation_of: Web/SVG/Element/script +--- +<h2 id="Resumen">Resumen</h2> + +<p>El <em>elemento HTML Script</em> (<strong><code><script></code></strong>) se utiliza para insertar o hacer referencia a un script ejecutable dentro de un documento HTML o XHTML.</p> + +<p>Los scripts sin atributo <code>async</code> o <code>defer</code>, así como las secuencias de comandos en línea, son interpretados y ejecutados inmediatamente, antes de que el navegador continúe procesando la página.</p> + +<table class="properties"> + <tbody> + <tr> + <th scope="row"><a href="/en-US/docs/Web/HTML/Content_categories" title="HTML/Content_categories">Content categories</a></th> + <td><a href="/en-US/docs/Web/HTML/Content_categories#Metadata_content" title="HTML/Content_categories#Metadata_content">Metadata content</a>, <a href="/en-US/docs/Web/HTML/Content_categories#Flow_content" title="HTML/Content_categories#Flow_content">Flow content</a>, <a href="/en-US/docs/Web/HTML/Content_categories#Phrasing_content" title="HTML/Content_categories#Phrasing_content">Phrasing content</a>.</td> + </tr> + <tr> + <th scope="row">Contenido permitido</th> + <td>Script dinámico tal como <code>text/javascript</code>.</td> + </tr> + <tr> + <th scope="row">Omision de etiquetas</th> + <td>{{no_tag_omission}}</td> + </tr> + <tr> + <th scope="row">Elementos padre permitidos</th> + <td>Cualquier elemento que acepte <a href="/en-US/docs/Web/HTML/Content_categories#Metadata_content" title="HTML/Content_categories#Metadata_content">metadata content</a>, o cualquier elemento que acepte <a href="/en-US/docs/Web/HTML/Content_categories#Phrasing_content">phrasing content</a>.</td> + </tr> + <tr> + <th scope="row">Interfaz DOM</th> + <td>{{domxref("HTMLScriptElement")}}</td> + </tr> + </tbody> +</table> + +<h2 id="Atributos">Atributos</h2> + +<p>Este elemento contiene los <a href="es/docs/Web/HTML/Atributos_Globales">atributos globales</a>.</p> + +<dl> + <dt>{{htmlattrdef("async")}} {{HTMLVersionInline(5)}}</dt> + <dd>Establece este atributo booleano para indicar al navegador, si es posible, ejecutar el código asincrónicamente. Esto no afecta a los scripts escritos dentro de la etiqueta (es decir a aquellos que no tienen el atributo <strong>src</strong>).</dd> + <dd>Ver {{anch("Browser compatibility")}} para notas acerca de compatibilidad. Ver tambien <a href="/en-US/docs/Games/Techniques/Async_scripts">Scripts asincrónicos para asm.js</a>.</dd> + <dt>{{htmlattrdef("integrity")}}</dt> + <dd>Contiene información de metadatos que es usada por el user agent del navegador para verificar el recurso captado fue entregado libre de manipulación inesperada. Ver <a href="/en-US/docs/Web/Security/Subresource_Integrity">Subresource Integrity</a>.</dd> + <dt>{{htmlattrdef("src")}}</dt> + <dd>Este atributo especifica la URI del script externo; este puede ser usado como alternativa a scripts embebidos directamente en el documento. Si el script tiene el atributo src, no debería tener código dentro de la etiqueta.</dd> + <dt>{{htmlattrdef("type")}}</dt> + <dd>Este atributo identifica el lenguaje de scripting en que está escrito el código embebido dentro de la etiqueta script, o referenciada utilizando el atributo src. Los valores posibles están especificados como un MIME type (tipo MIME). <br> + Algunos ejemplos de tipos MIME que pueden ser utilizados son: <code>text/javascript</code>, <code>text/ecmascript</code>, <code>application/javascript</code>, y <code>application/ecmascript. </code>Si el atributo se encuentra ausente, el valor por defecto será un script JavaScript.</dd> + <dd>Si el tipo MIME especificado no es un tipo JavaScript, el contenido embebido dentro de la etiqueta script es tratado como un bloque de datos que no será procesado por el navegador.</dd> + <dd>Si el tipo especificado es module, el código es tratado como un módulo JavaScript {{experimental_inline}}. Ver <a href="https://hacks.mozilla.org/2015/08/es6-in-depth-modules/">ES6 in Depth: Modules</a>.</dd> + <dd>Nota: en Firefox puedes usar características avanzadas tales como let statements y otras características de la última versión de JS, usando type=application/javascript;version=1.8 {{Non-standard_inline}}. Ten cuidado!, esto no es una característica estándar, es decir, probablemente genere conflictos con otros navegadores, en particular aquellos basados en Chromium.</dd> + <dd>Para incluir lenguajes de programación exóticos, lee acerca de <a href="/en-US/Add-ons/Code_snippets/Rosetta">Rosetta</a>.</dd> + <dt>{{htmlattrdef("text")}}</dt> + <dd>Este atributo actúa como el atributo <code>textContent</code>, establece el texto contenido del elemento. Pero a diferencia de <code>textContent</code>, este atributo se evalúa como ejecutable luego de ser insertado como nodo en el DOM.</dd> + <dt>{{htmlattrdef("language")}} {{Deprecated_inline}}</dt> + <dd>Este atributo actúa como el atributo <code>type</code>, identifica el tipo de lenguaje que se utiliza. A diferencia del atributo <code>type</code>, los posibles valores de este atributo nunca fueron estandarizados. El atributo <code>type</code> debe ser utilizado en lugar de <code>language</code>.</dd> + <dt>{{htmlattrdef("defer")}}</dt> + <dd>Este atributo establece si el script debe ser ejecutado luego de que el documento entero sea analizado. Dado que esta función aún no fue implementada por todos los navegadores relevantes, los autores no deberían asumir que el script realmente será ejecutado luego de la carga y analisis del documento. Desde Gecko 1.9.2 el atributo defer es ignorado en los scripts que no tienen el atributo src. Sin embargo, en Gecko 1.9.1 incluso se difieren los scripts escritos dentro de la etiqueta.</dd> + <dt>{{htmlattrdef("crossorigin")}} {{Non-standard_inline}}</dt> + <dd>Elementos normales script pasan información mínima al {{domxref('GlobalEventHandlers.onerror', 'window.onerror')}} para scripts que no pasan las revisiones del estándar <a href="/es/docs/Web/HTTP/Access_control_CORS">CORS</a>. Para permitir registrar errores en los sitios que usan dominios separados para recursos estáticos, usar este atributo.</dd> +</dl> + +<h2 id="Ejemplos">Ejemplos</h2> + +<pre class="brush: html"><!-- HTML4 y (x)HTML --> +<script type="text/javascript" src="javascript.js"></script> + +<!-- HTML5 --> +<script src="javascript.js"></script> +</pre> + +<h2 id="Especificaciones">Especificaciones</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Especificación</th> + <th scope="col">Estado</th> + <th scope="col">Comentario</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('HTML WHATWG', "scripting.html#the-script-element", "<script>")}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td>Agrega el tipo module.</td> + </tr> + <tr> + <td>{{SpecName('HTML5 W3C', 'scripting-1.html#script', '<script>')}}</td> + <td>{{Spec2('HTML5 W3C')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('HTML4.01', 'interact/scripts.html#h-18.2.1', '<script>')}}</td> + <td>{{Spec2('HTML4.01')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('Subresource Integrity', '#htmlscriptelement', '<script>')}}</td> + <td>{{Spec2('Subresource Integrity')}}</td> + <td>Agrega el atributo integrity.</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2> + +<div>{{CompatibilityTable}}</div> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Característica</th> + <th>Chrome</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatChrome(1.0)}}</td> + <td>{{CompatGeckoDesktop("1.0")}}<sup>[2]</sup></td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + <tr> + <td>async attribute</td> + <td>{{CompatVersionUnknown}}<sup>[1]</sup></td> + <td>{{CompatGeckoDesktop("1.9.2")}}<sup>[1]</sup></td> + <td>10<sup>[1]</sup></td> + <td>{{CompatNo}}<sup>[1]</sup></td> + <td>{{CompatVersionUnknown}}<sup>[1]</sup></td> + </tr> + <tr> + <td>defer attribute</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoDesktop("1.9.1")}}</td> + <td> + <p>4[3]<br> + 10</p> + </td> + <td>{{CompatNo}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + <tr> + <td>crossorigin attribute</td> + <td>{{CompatChrome(30.0)}}</td> + <td>{{CompatGeckoDesktop("13")}}</td> + <td>{{CompatNo}}</td> + <td>12.50</td> + <td>{{CompatVersionUnknown}}<sup>[4]</sup></td> + </tr> + <tr> + <td>integrity attribute</td> + <td>{{CompatChrome(45.0)}}</td> + <td>{{CompatGeckoDesktop("43")}}</td> + <td> </td> + <td> </td> + <td>{{CompatNo}}<sup>[5]</sup></td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Android</th> + <th>Android Webview</th> + <th>Firefox Mobile (Gecko)</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + <th>Chrome for Android</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoMobile("1.0")}}<sup>[2]</sup></td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + <tr> + <td>async attribute</td> + <td>{{CompatVersionUnknown}}<sup>[1]</sup></td> + <td>{{CompatVersionUnknown}}<sup>[1]</sup></td> + <td>{{CompatGeckoMobile("1.0")}}<sup>[1]</sup></td> + <td>{{CompatNo}}<sup>[1]</sup></td> + <td>{{CompatUnknown}}<sup>[1]</sup></td> + <td>{{CompatVersionUnknown}}<sup>[1]</sup></td> + <td>{{CompatVersionUnknown}}<sup>[1]</sup></td> + </tr> + <tr> + <td>defer attribute</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoMobile("1.0")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + <tr> + <td>integrity attribute</td> + <td>{{CompatNo}}</td> + <td>{{CompatChrome(45.0)}}</td> + <td>{{CompatGeckoDesktop("43")}}</td> + <td> </td> + <td> </td> + <td> </td> + <td>{{CompatChrome(45.0)}}</td> + </tr> + </tbody> +</table> +</div> + +<p>[1] In older browsers that don't support the <code>async</code> attribute, parser-inserted scripts block the parser; script-inserted scripts execute asynchronously in IE and WebKit, but synchronously in Opera and pre-4.0 Firefox. In Firefox 4.0, the <code>async</code> DOM property defaults to <code>true</code> for script-created scripts, so the default behavior matches the behavior of IE and WebKit. To request script-inserted external scripts be executed in the insertion order in browsers where the <code>document.createElement("script").async</code> evaluates to <code>true</code> (such as Firefox 4.0), set <code>.async=false</code> on the scripts you want to maintain order. Never call <code>document.write()</code> from an <code>async</code> script. In Gecko 1.9.2, calling <code>document.write()</code> has an unpredictable effect. In Gecko 2.0, calling <code>document.write()</code> from an <code>async</code> script has no effect (other than printing a warning to the error console).</p> + +<p>[2] Starting in Gecko 2.0 {{geckoRelease("2.0")}}, inserting script elements that have been created by calling <code>document.createElement("script")</code> into the DOM no longer enforces execution in insertion order. This change lets Gecko properly abide by the HTML5 specification. To make script-inserted external scripts execute in their insertion order, set <code>.async=false</code> on them.</p> + +<p>Also, {{HTMLElement("script")}} elements inside {{HTMLElement("iframe")}}, {{HTMLElement("noembed")}} and {{HTMLElement("noframes")}} elements are now executed, for the same reasons.</p> + +<p>[3] In versions prior to Internet Explorer 10 Trident implemented <code><script></code> by a proprietary specification. Since version 10 it conforms to the W3C specification.</p> + +<p>[4] The <code>crossorigin</code> attribute was implemented in WebKit in {{WebKitBug(81438)}}.</p> + +<p>[5] {{WebKitBug(148363)}} tracks WebKit implementation of Subresource Integrity (which includes the <code>integrity</code> attribute).</p> + +<h2 id="Ver_también">Ver también</h2> + +<ul> + <li>{{domxref("document.currentScript")}}</li> + <li><a href="http://pieisgood.org/test/script-link-events/">Ryan Grove's <script> and <link> node event compatibility chart</a></li> +</ul> + +<p>{{HTMLRef}}</p> |