1 files changed, 84 insertions, 0 deletions
diff --git a/files/it/web/api/element/classname/index.html b/files/it/web/api/element/classname/index.html
new file mode 100644
index 0000000000..ca463f5f75
--- /dev/null
+++ b/files/it/web/api/element/classname/index.html
@@ -0,0 +1,84 @@
+---
+title: Element.className
+slug: Web/API/Element/className
+tags:
+  - API
+  - DOM
+  - Gecko
+  - Proprietà
+  - Referenza
+translation_of: Web/API/Element/className
+---
+<div>{{APIRef("DOM")}}</div>
+
+<p><span class="seoSummary">La proprietà <code><strong>className</strong></code> dell'interfaccia {{domxref("Element")}} ottiene e imposta il valore <a href="/en-US/docs/Web/HTML/Global_attributes/class">dell'attributo <code>class</code></a> dell'elemento specificato.</span></p>
+
+<h2 id="Sintassi">Sintassi</h2>
+
+<pre class="syntaxbox"><var>var cName</var> = <var>elementNodeReference</var>.className;
+<var>elementNodeReference</var>.className = <var>cName</var>;</pre>
+
+<ul>
+ <li><code>cName</code> è una variabile stringa che rappresenta le classi o le classi separate dallo spazio dell'elemento corrente.</li>
+</ul>
+
+<h2 id="Esempio">Esempio</h2>
+
+<pre class="brush: js">let el = document.getElementById('item');
+
+if (el.className === 'active'){
+  el.className = 'inactive';
+} else {
+  el.className = 'active';
+}</pre>
+
+<h2 id="Appunti">Appunti</h2>
+
+<p>Il nome <code>className</code> viene utilizzato per questa proprietà anziché <code>class</code> a causa di conflitti con la parola chiave "class" in molti linguaggi che vengono utilizzati per manipolare il DOM.</p>
+
+<p><code>className</code> può anche essere un'istanza di {{domxref("SVGAnimatedString")}} se <code>element</code> è un {{domxref("SVGElement")}}. È meglio ottenere/impostare <code>className</code> di un elemento usando {{domxref("Element.getAttribute")}} e {{domxref("Element.setAttribute")}} se si ha a che fare con elementi SVG. Tuttavia, tieni presente che {{domxref("Element.getAttribute")}} ritorna <code><a href="https://developer.mozilla.org/it/docs/Web/JavaScript/Reference/Global_Objects/null">null</a></code> anzichè <code>""</code> se <code>element</code> ha un <a href="/en-US/docs/Web/HTML/Global_attributes/class">attributo <code>class</code></a> vuoto.</p>
+
+<pre class="brush: js">elm.setAttribute('class', elm.getAttribute('class'))</pre>
+
+<div class="note">
+<p><code>class</code> è un <strong>Attributo</strong> <strong>HTML</strong>, mentre <code>className</code> è una <strong>proprietà del DOM</strong>.</p>
+</div>
+
+<h2 id="Specifiche">Specifiche</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specifica</th>
+   <th scope="col">Stato</th>
+   <th scope="col">Commento</th>
+  </tr>
+  <tr>
+   <td>{{SpecName("DOM WHATWG", "#dom-element-classname", "element.className")}}</td>
+   <td>{{Spec2("DOM WHATWG")}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName("DOM4", "#dom-element-classname", "element.className")}}</td>
+   <td>{{Spec2("DOM4")}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName("DOM2 HTML", "html.html#ID-95362176", "element.className")}}</td>
+   <td>{{Spec2("DOM2 HTML")}}</td>
+   <td>Definizione iniziale</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilità_con_i_browser">Compatibilità con i browser</h2>
+
+
+
+<p>{{Compat("api.Element.className")}}</p>
+
+<h2 id="Vedi_anche">Vedi anche</h2>
+
+<ul>
+ <li>{{domxref("element.classList")}}</li>
+</ul>