1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
|
---
title: DOMTokenList.add()
slug: Web/API/DOMTokenList/add
translation_of: Web/API/DOMTokenList/add
---
<p>{{APIRef("DOM")}}</p>
<p>Die <code><strong>add()</strong></code> Methode des {{domxref("DOMTokenList")}} Interfaces, fügt ein <em>token</em> der Liste an.</p>
<h2 id="Syntax">Syntax</h2>
<pre class="syntaxbox">tokenList.add(token1[, token2[, ...]]);</pre>
<h3 id="Parameter">Parameter</h3>
<dl>
<dt>token</dt>
<dd>Ein {{domxref("DOMString")}} ,welches das <em>token</em> repräsentiert, welches an die Liste angefügt werden soll.</dd>
</dl>
<h3 id="Rückgabewert">Rückgabewert</h3>
<p><code>undefined</code></p>
<h2 id="Beispiele">Beispiele</h2>
<p>Im folgenden Beispiel erhalten wir die Liste der Klassen eines {{htmlelement("span")}} Elementes als <code>DOMTokenList</code> , mit Hilfe von {{domxref("Element.classList")}}. Wir fügen der Liste dann ein neues <em>token</em> an und schreiben die Liste als inhalt in das <code><span>.</code></p>
<p>Das HTML:</p>
<pre class="brush: html"><span class="a b c"></span></pre>
<p>Nun das JavaScript:</p>
<pre class="brush: js">var span = document.querySelector("span");
var classes = span.classList;
classes.add("d");
span.textContent = classes;
</pre>
<p>Die Ausgabe:</p>
<p>{{ EmbedLiveSample('Examples', '100%', 60) }}</p>
<p>Man kann auch mehrere <em>tokens</em> auf einmal hinzufügen:</p>
<pre class="brush: js">span.classList.add("d", "e", "f");
</pre>
<h2 id="Spezifikationen">Spezifikationen</h2>
<table class="standard-table">
<tbody>
<tr>
<th scope="col">Spezifikation</th>
<th scope="col">Status</th>
<th scope="col">Kommentar</th>
</tr>
<tr>
<td>{{SpecName('DOM WHATWG','#dom-domtokenlist-add','add()')}}</td>
<td>{{Spec2('DOM WHATWG')}}</td>
<td>Initial definition</td>
</tr>
</tbody>
</table>
<h2 id="Browser_Kompatibilität">Browser Kompatibilität</h2>
<div>
<div class="hidden">Die Kompatibilitätstabelle auf dieser Seite ist aus strukturierten Daten generiert worden. Wenn du helfen willst, den Datenbestand zu erweitern, besuche <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> und sende uns einen pull - Request.</div>
<p>{{Compat("api.DOMTokenList.add")}}</p>
</div>
|
