1 files changed, 119 insertions, 0 deletions
diff --git a/files/ca/web/html/global_attributes/data-_star_/index.html b/files/ca/web/html/global_attributes/data-_star_/index.html
new file mode 100644
index 0000000000..e0984687a0
--- /dev/null
+++ b/files/ca/web/html/global_attributes/data-_star_/index.html
@@ -0,0 +1,119 @@
+---
+title: data-*
+slug: Web/HTML/Global_attributes/data-*
+tags:
+  - Global attributes
+  - HTML
+  - Reference
+translation_of: Web/HTML/Global_attributes/data-*
+---
+<p class="note">{{HTMLSidebar("Global_attributes")}}</p>
+
+<p>Els <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes">atributs globals</a> <strong>data-*</strong> formen una classe d'atributs anomenats <strong>atributs de dades personalitzades</strong>, que permeten que la informació propietària s'intercanviï entre l' <a href="https://developer.mozilla.org/en-US/docs/Web/HTML" title="en/HTML">HTML</a> i la seva representació <a href="https://developer.mozilla.org/en-US/docs/DOM" title="en/DOM">DOM</a> mitjançan scripts. Totes aquestes dades personalitzades estan disponibles a través de la interfície {{domxref ("HTMLElement")}} de l'element en el qual s'estableix l'atribut. La propietat {{domxref ("HTMLElement.dataset")}} li dóna accés. El * pot ser reemplaçat per qualsevol nom que segueix <a href="http://www.w3.org/TR/REC-xml/#NT-Name">la regla de producció de noms XML</a> amb les següents restriccions:</p>
+
+<ul>
+ <li>el nom no ha de començar amb <code>xml</code>, qualsevol que sigui el cas que s'utilitzi per a aquestes lletres;</li>
+ <li>el nom no ha de contenir cap punt i coma (U+003A);</li>
+ <li>el nom no ha de contenir majúscules de l'A a la Z.</li>
+</ul>
+
+<p>Recordeu que la propietat {{domxref ("HTMLElement.dataset")}} és un {{domxref ("DOMStringMap")}}, i el nom de l'atribut de dades personalitzades <em>data-test-value</em> serà accessible a través de <code>HTMLElement.dataset.testValue</code> ( o <code>HTMLElement.dataset["testValue"]</code> ) com qualsevol guió (<code>u+002D</code>) se substitueix la següent lletra en majúscula, convertint el nom a (CamelCase).</p>
+
+<h3 id="Ùs">Ùs</h3>
+
+<p>Mitjançant la incorpoarció d'atributs <strong>data-</strong>*, fins i tot els elements HTML ordinaris poden convertir-se en programes-objectes força complexos i potents. Per exemple, una nau espacial "<a href="https://en.wikipedia.org/wiki/Sprite_%28computer_graphics%29">sprite</a>" en un joc podria ser un simple element {{HTMLElement ("img")}} amb un atribut <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/class">class</a> i diversos atributs data- *:</p>
+
+<pre>&lt;img class="spaceship cruiserX3" src="shipX3.png"
+  data-ship-id="324"   data-weapons="laserI laserII"   data-shields="72%"
+  data-x="414354" data-y="85160" data-z="31940"
+  onclick="spaceships[this.dataset.shipId].blasted()"
+&lt;/img&gt;
+</pre>
+
+<p id="Specifications">(Veure més <em><a href="https://html.spec.whatwg.org/multipage/dom.html#embedding-custom-non-visible-data-with-the-data-*-attributes">aquí</a>)</em></p>
+
+<h2 id="Especificacions">Especificacions</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificació</th>
+   <th scope="col">Estat</th>
+   <th scope="col">Comentari</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', "dom.html#embedding-custom-non-visible-data-with-the-data-*-attributes", "data-*")}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>Sense canvis des de l'última instantània, {{SpecName('HTML5.1')}}</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5.1', "dom.html#embedding-custom-non-visible-data-with-the-data-*-attributes", "data-*")}}</td>
+   <td>{{Spec2('HTML5.1')}}</td>
+   <td>Instantània de {{SpecName('HTML WHATWG')}}, sense canvis des de {{SpecName('HTML5 W3C')}}</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', "dom.html#embedding-custom-non-visible-data-with-the-data-*-attributes", "data-*")}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td>Instantània de {{SpecName('HTML WHATWG')}}, definició inicial.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Navegadors_compatibles">Navegadors compatibles</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<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>Suport bàsic</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatGeckoDesktop(6) }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Suport bàsic</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatGeckoMobile(6) }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Veure">Veure</h2>
+
+<ul>
+ <li>Tots els <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes">atributs globals</a>.</li>
+ <li>La propietat {{domxref ("HTMLElement.dataset")}} permet accedir i modificar aquests valors.</li>
+</ul>