---
title: CSS.escape()
slug: Web/API/CSS/escape
tags:
  - API
  - CSS
  - CSSOM
  - Méthode
  - Referenz
  - Statisch
  - escape()
  - maskieren
translation_of: Web/API/CSS/escape
---
<p>{{APIRef("CSSOM")}}{{SeeCompatTable}}</p>

<p>Die statische Methode <code><strong>CSS.escape()</strong></code><strong> </strong>gibt ein {{DOMxRef("CSSOMString")}} zurück, das die maskierte Zeichenfolge des übergebenen String Parameters enthält, hauptsächlich zur Verwendung als Teil eines CSS Selektors.</p>

<h2 id="Syntax">Syntax</h2>

<pre class="syntaxbox notranslate"><var>escapedStr</var> = CSS.escape(<var>str</var>);
</pre>

<h3 id="Parameter">Parameter</h3>

<dl>
 <dt><em>str</em></dt>
 <dd>Die zu maskierende Zeichenfolge {{DOMxRef("CSSOMString")}}.</dd>
</dl>

<h2 id="Beispiele">Beispiele</h2>

<h3 id="Grundlegende_Ergebnisse"><span class="tlid-translation translation" lang="de"><span title="">Grundlegende Ergebnisse</span></span></h3>

<pre class="brush: js notranslate">CSS.escape(".foo#bar")        // "\.foo\#bar"
CSS.escape("()[]{}")          // "\(\)\[\]\\{\\}"
CSS.escape('--a')             // "--a"
CSS.escape(0)                 // "\30 ", the Unicode code point of '0' is 30
CSS.escape('\0')              // "\ufffd", the Unicode REPLACEMENT CHARACTER</pre>

<h3 id="Verwendung_im_Kontext">Verwendung im Kontext</h3>

<p>Um einen String als Teil eines Selektors zu maskieren kann die <code>escape()</code> Methode verwendet werden:</p>

<pre class="brush: js; notranslate">var element = document.querySelector('#' + CSS.escape(id) + ' &gt; img');</pre>

<p>Die <code>escape()</code> Methode kann auch verwendet werden um Strings zu maskieren. Die Maskierung wird dabei auf Zeichen angewendet, die streng genommen nicht maskiert werden müssen.</p>

<pre class="brush: js; notranslate">var element = document.querySelector('a[href="#' + CSS.escape(fragment) + '"]');</pre>

<h2 id="Spezifikation">Spezifikation</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('CSSOM', '#the-css.escape()-method', 'CSS.escape()')}}</td>
   <td>{{Spec2('CSSOM')}}</td>
   <td>Initial definition</td>
  </tr>
 </tbody>
</table>

<h2 id="Browserkompatibilität">Browserkompatibilität</h2>



<p>{{Compat("api.CSS.escape")}}</p>

<h2 id="Siehe_auch">Siehe auch</h2>

<ul>
 <li>Das {{DOMxRef("CSS")}} Interface das die statischen Methoden beinhaltet.</li>
 <li><a href="https://github.com/mathiasbynens/CSS.escape/blob/master/css.escape.js">Ein Polyfill für CSS.escape</a></li>
</ul>