> ## Documentation Index
> Fetch the complete documentation index at: https://docs.kameleoon.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Kameleoon.API.Utils

> Referenz der Hilfsmethoden von Kameleoon.API.Utils für Listener, Timer, Hashing, URL-Parameter und HTTP-Anfragen.

Dieses Modul stellt Hilfsmethoden für häufige Vorgänge bereit.

## addEventListener

Die Methode `addEventListener()` hängt einen Ereignishandler an das angegebene Element an.

```javascript theme={null}
var popin = document.createElement("div");
popin.id = "kameleoonPopin";
popin.innerHTML = "<img src='https://www.mywebsite.com/myImage.jpg'/>";
document.body.appendChild(popin);

Kameleoon.API.Utils.addEventListener(popin, "mousedown", function (event) {
  document.body.removeChild(popin);
});
```

> [!NOTE]
>
> Kameleoon setzt alle Ereignishandler zurück, die über diese API während Engine-Reloads erstellt wurden. Verwenden Sie diese Methode, um Listener in SPAs hinzuzufügen und ordnungsgemäße Bereinigung zu gewährleisten.

**Arguments**

| Name | Type | Description |
| - | - | - |
| element | Object | Zielelement für den Listener. Dieses Feld ist erforderlich. |
| eventType | String | Ereignisname. Dieses Feld ist erforderlich. |
| callback | Function | Funktion zum Ausführen, wenn das Ereignis ausgelöst wird. Dieses Feld ist erforderlich. |

## addUniversalClickListener

Die Methode `addUniversalClickListener()` hängt einen Click-Handler an, der Mausklicks auf dem Desktop und Touchdowns auf Mobilgeräten und Tablets abhört. Bei Mobilgeräten tritt ein Touchdown auf, wenn die Engine ein `touchstart`-Ereignis gefolgt von einem `touchend`-Ereignis ohne ein dazwischenliegendes `touchmove`-Ereignis erkennt.

```javascript theme={null}
let btn = document.querySelector("#MyButton");

Kameleoon.API.Utils.addUniversalClickListener(btn, function (event) {
  let goalID = 1234;
  Kameleoon.API.Goals.processConversion(goalID);
});
```

> [!NOTE]
>
> Kameleoon setzt alle über diese API erstellten Listener während Engine-Reloads zurück, was die Bereinigung in SPAs erleichtert.

> [!NOTE]
>
> On desktop devices, right-clicks trigger this method (zum Beispiel beim Öffnen eines Links in einem neuen Tab).

**Arguments**

| Name | Type | Description |
| - | - | - |
| element | Object | Zielelement für den Listener. Dieses Feld ist erforderlich. |
| callback | Function | Funktion zum Ausführen, wenn das Click-Ereignis ausgelöst wird. Dieses Feld ist erforderlich. |

## clearInterval

Die Methode `clearInterval()` löscht einen Timer, den Sie über `setInterval()` gesetzt haben.

```javascript theme={null}
var myInterval = Kameleoon.API.Utils.setInterval(function () {
  if (window.dataLayer != null) {
    Kameleoon.API.Utils.clearInterval(myInterval);
  }
}, 1000);
```

**Arguments**

| Name | Type | Description |
| - | - | - |
| intervalId | Number | Timer-ID, die von der Methode `setInterval()` zurückgegeben wird. Dieses Feld ist erforderlich. |

## clearTimeout

Die Methode `clearTimeout()` löscht einen Timer, den Sie über `setTimeout()` gesetzt haben.

```javascript theme={null}
var myTimeout = Kameleoon.API.Utils.setTimeout(function () {
  var popin = document.createElement("div");
  popin.id = "kameleoonPopin";
  popin.innerHTML = "<img src='https://www.mywebsite.com/myImage.jpg'/>";
  document.body.appendChild(popin);
}, 5000);

Kameleoon.API.Utils.addEventListener(document.body, "mousedown", function () {
  Kameleoon.API.Utils.clearTimeout(myTimeout);
});
```

**Arguments**

| Name | Type | Description |
| - | - | - |
| timeoutId | Number | Timer-ID, die von `setTimeout()` zurückgegeben wird. |

## computeHash

Die Methode `computeHash()` berechnet einen Hash aus einer Zeichenkette. Verwenden Sie dies, um eindeutige Daten zu verarbeiten, ohne vertrauliche persönliche Informationen direkt zu manipulieren.

```javascript theme={null}
var emailId = Kameleoon.API.Utils.createHash("myemail@mail.com");
Kameleoon.API.Data.setCustomData("VisitorEmail", emailId);
```

**Arguments**

| Name | Type | Description |
| - | - | - |
| string | String | Die Quellzeichenkette, aus der der Hash berechnet werden soll. |

**Rückgabewert**

| Name | Type | Description |
| - | - | - |
| hash | String | Resultierender Hash. Der verwendete Algorithmus ist derselbe wie die [Implementierung von `hashCode()` für java.lang.String](https://www.w3schools.com/java/ref_string_hashcode.asp). |

## getURLParameters

Die `getURLParameters()` Methode analysiert die aktuelle URL und gibt alle erkannten Parameter zurück. Diese Methode unterstützt sowohl Such-(?)-als auch Hash-(#)-Parameter.

```javascript theme={null}
var parameters = Kameleoon.API.Utils.getURLParameters();

if (parameters.productID != null) {
  Kameleoon.API.Events.trigger("ProductPage");
}
```

**Rückgabewert**

| Name | Type | Description |
| - | - | - |
| parameters | Object | Objekt mit Parameternamen als Schlüsseln und Parameterwerten als Werten. |

## performRequest

Die Methode `performRequest()` leitet einen Anruf an einen Remote-Webserver ein.

```javascript theme={null}
Kameleoon.API.Utils.performRequest(
  "https://www.my_web_server_url.com",
  function () {
    if (this.readyState == 4 && this.status == 200) {
      eval(this.responseText);
    }
  },
  function() {
    console.log("Request cancelled");
  },
  2000
);
```

**Arguments**

| Name | Type | Description |
| - | - | - |
| url | String | Die URL des Remote-Servers. Dieses Feld ist erforderlich. |
| readyStateHandler | Function | Callback-Funktion, die die Methode ausführt, wenn der Server eine Antwort sendet. Die Methode übergibt das Argument event an diese Funktion ([load-Ereignis](https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/load_event)) und bindet das zugrunde liegende XMLHttpRequest-Objekt an den Callback. Alle [Eigenschaften von XMLHttpRequest](https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest#Properties) sind daher im Callback über **this** verfügbar. Dieses Feld ist optional. |
| errorHandler | Function | Callback-Funktion, die die Methode ausführt, wenn ein Fehler auftritt. Die Methode übergibt das Argument event an diese Funktion ([error-Ereignis](https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequestEventTarget/onerror) oder [timeout-Ereignis](https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/timeout)) und bindet das zugrunde liegende XMLHttpRequest-Objekt an den Callback. Alle [Eigenschaften von XMLHttpRequest](https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest#Properties) sind daher im Callback über **this** verfügbar. Dieses Feld ist optional. |
| timeout | Number | Wartezeit in Millisekunden vor dem Abbrechen der Anfrage. Standard: 5000 Millisekunden. |

## querySelectorAll

Die `querySelectorAll()` Methode gibt alle Dokumentelemente zurück, die den angegebenen CSS-Selektoren entsprechen, als statisches `NodeList` Objekt.

```javascript theme={null}
var foundElements = Kameleoon.API.Utils.querySelectorAll(".kameleoonClassName");

foundElements.forEach(function (element) {
  element.style.display = "none";
});
```

> [!NOTE]
>
> Diese Methode unterstützt Selektoren mit **:contains** und **:eq**.

**Arguments**

| Name | Type | Description |
| - | - | - |
| selector | String | Ein oder mehrere CSS-Selektoren. Dieses Feld ist erforderlich. |

**Rückgabewert**

| Name | Type | Description |
| - | - | - |
| elements | Array | Liste der Elemente, die der Abfrage entsprechen. |

## setInterval

Die Methode `setInterval()` führt eine Funktion oder einen Ausdruck in den angegebenen Millisekundenintervallen aus.

Kameleoon setzt alle über diese API erstellten Intervalle während Engine-Reloads zurück. Verwenden Sie diese Methode in SPAs, um ordnungsgemäße Bereinigung zu gewährleisten.

```javascript theme={null}
var countdown = 10;
var timer = document.createElement("div");
timer.innerHTML = countdown.toString();
document.body.appendChild(timer);

var myInterval = Kameleoon.API.Utils.setInterval(function () {
  countdown--;
  timer.innerHTML = countdown.toString();

  if (countdown == 0) {
    Kameleoon.API.Utils.clearInterval(myInterval);
  }
}, 1000);
```

**Arguments**

| Name | Type | Description |
| - | - | - |
| function | Function | JavaScript-Funktion, die die Methode regelmäßig ausführt. Dieses Feld ist erforderlich. |
| milliseconds | Number | Dauer des Intervalls in Millisekunden. Der Standardwert beträgt 200 Millisekunden. |

**Rückgabewert**

| Name | Type | Description |
| - | - | - |
| intervalId | Number | Timer-ID zur Verwendung mit `clearInterval()`. |

## setTimeout

Die Methode `setTimeout()` führt eine Funktion oder einen Ausdruck nach der angegebenen Anzahl von Millisekunden aus.

Kameleoon setzt alle über diese API erstellten Timeouts während Engine-Reloads zurück. Verwenden Sie diese Methode in SPAs, um ordnungsgemäße Bereinigung zu gewährleisten.

```javascript theme={null}
var myTimeout = Kameleoon.API.Utils.setTimeout(function () {
  Kameleoon.API.Events.Trigger("5 seconds elapsed");
}, 5000);
```

**Arguments**

| Name | Type | Description |
| - | - | - |
| function | Function | JavaScript-Funktion, die die Methode regelmäßig ausführt. Dieses Feld ist erforderlich. |
| milliseconds | Number | Wartezeit in Millisekunden vor der Ausführung der Funktion. Standard: 200 Millisekunden. |

**Rückgabewert**

| Name | Type | Description |
| - | - | - |
| timeoutId | Number | Timer-ID zur Verwendung mit `clearTimeout()`. |