> ## 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

> Referencia de los métodos auxiliares Kameleoon.API.Utils para listeners, temporizadores, hashing, parámetros de URL y peticiones HTTP.

Este módulo proporciona métodos de utilidad para operaciones comunes.

## addEventListener

El método `addEventListener()` asocia un manejador de eventos al elemento especificado.

```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 reinicia todos los event listeners creados a través de esta API durante las recargas del motor. Use este método para añadir listeners en SPAs y garantizar una limpieza adecuada.

**Argumentos**

| Nombre | Tipo | Descripción |
| - | - | - |
| element | Object | Elemento objetivo del listener. Este campo es obligatorio. |
| eventType | String | Nombre del evento. Este campo es obligatorio. |
| callback | Function | Función que se ejecuta cuando se dispara el evento. Este campo es obligatorio. |

## addUniversalClickListener

El método `addUniversalClickListener()` asocia un manejador de clic que escucha clics de ratón en escritorio y eventos de touchdown en dispositivos móviles y tablets. En dispositivos móviles, se produce un touchdown si el motor detecta un evento `touchstart` seguido de un evento `touchend` sin un `touchmove` intermedio.

```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 reinicia todos los listeners creados a través de esta API durante las recargas del motor, lo que facilita la limpieza en SPAs.

> [!NOTE]
>
> En dispositivos de escritorio, los clics derechos también disparan este método (por ejemplo, al abrir un enlace en una nueva pestaña).

**Argumentos**

| Nombre | Tipo | Descripción |
| - | - | - |
| element | Object | Elemento objetivo del listener. Este campo es obligatorio. |
| callback | Function | Función que se ejecuta cuando se dispara el evento de clic. Este campo es obligatorio. |

## clearInterval

El método `clearInterval()` cancela un temporizador que estableció mediante `setInterval()`.

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

**Argumentos**

| Nombre | Tipo | Descripción |
| - | - | - |
| intervalId | Number | ID del temporizador devuelto por el método `setInterval()`. Este campo es obligatorio. |

## clearTimeout

El método `clearTimeout()` cancela un temporizador que estableció mediante `setTimeout()`.

```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);
});
```

**Argumentos**

| Nombre | Tipo | Descripción |
| - | - | - |
| timeoutId | Number | ID del temporizador devuelto por `setTimeout()`. |

## computeHash

El método `computeHash()` calcula un hash a partir de una cadena. Úselo para procesar datos únicos sin manipular directamente información personal sensible.

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

**Argumentos**

| Nombre | Tipo | Descripción |
| - | - | - |
| string | String | La cadena de origen a partir de la cual calcular el hash. |

**Valor de retorno**

| Nombre | Tipo | Descripción |
| - | - | - |
| hash | String | Hash resultante. El algoritmo utilizado es el mismo que la [implementación de `hashCode()` para java.lang.String](https://www.w3schools.com/java/ref_string_hashcode.asp). |

## getURLParameters

El método `getURLParameters()` analiza la URL actual y devuelve todos los parámetros detectados. Este método admite tanto los parámetros de búsqueda (?) como los de hash (#).

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

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

**Valor de retorno**

| Nombre | Tipo | Descripción |
| - | - | - |
| parameters | Object | Objeto con los nombres de los parámetros como claves y los valores como valores. |

## performRequest

El método `performRequest()` inicia una llamada a un servidor web remoto.

```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
);
```

**Argumentos**

| Nombre | Tipo | Descripción |
| - | - | - |
| url | String | La URL del servidor remoto. Este campo es obligatorio. |
| readyStateHandler | Function | Función de devolución de llamada que el método ejecuta cuando el servidor envía una respuesta. El método pasa el argumento event a esta función ([evento load](https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/load_event)) y vincula el objeto XMLHttpRequest subyacente a la devolución de llamada. Por tanto, todas las [propiedades de XMLHttpRequest](https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest#Properties) están disponibles dentro de la devolución de llamada mediante **this**. Este campo es opcional. |
| errorHandler | Function | Función de devolución de llamada que el método ejecuta cuando se produce un error. El método pasa el argumento event a esta función ([evento error](https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequestEventTarget/onerror) o [evento timeout](https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/timeout)) y vincula el objeto XMLHttpRequest subyacente a la devolución de llamada. Por tanto, todas las [propiedades de XMLHttpRequest](https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest#Properties) están disponibles dentro de la devolución de llamada mediante **this**. Este campo es opcional. |
| timeout | Number | Tiempo de espera en milisegundos antes de cancelar la solicitud. Por defecto 5000 milisegundos. |

## querySelectorAll

El método `querySelectorAll()` devuelve todos los elementos del documento que coincidan con los selectores CSS especificados como un objeto `NodeList` estático.

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

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

> [!NOTE]
>
> Este método admite selectores con **:contains** y **:eq**.

**Argumentos**

| Nombre | Tipo | Descripción |
| - | - | - |
| selector | String | Uno o más selectores CSS. Este campo es obligatorio. |

**Valor de retorno**

| Nombre | Tipo | Descripción |
| - | - | - |
| elements | Array | Lista de elementos que coinciden con la consulta. |

## setInterval

El método `setInterval()` ejecuta una función o expresión en el intervalo especificado en milisegundos.

Kameleoon reinicia todos los intervalos creados a través de esta API durante las recargas del motor. Use este método en SPAs para garantizar una limpieza adecuada.

```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);
```

**Argumentos**

| Nombre | Tipo | Descripción |
| - | - | - |
| function | Function | Función JavaScript que el método ejecuta periódicamente. Este campo es obligatorio. |
| milliseconds | Number | Duración del intervalo en milisegundos. Por defecto 200 milisegundos. |

**Valor de retorno**

| Nombre | Tipo | Descripción |
| - | - | - |
| intervalId | Number | ID del temporizador para usar con `clearInterval()`. |

## setTimeout

El método `setTimeout()` ejecuta una función o expresión tras el número de milisegundos especificado.

Kameleoon reinicia todos los timeouts creados a través de esta API durante las recargas del motor. Use este método en SPAs para garantizar una limpieza adecuada.

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

**Argumentos**

| Nombre | Tipo | Descripción |
| - | - | - |
| function | Function | Función JavaScript que el método ejecuta periódicamente. Este campo es obligatorio. |
| milliseconds | Number | Tiempo de espera en milisegundos antes de ejecutar la función. Por defecto 200 milisegundos. |

**Valor de retorno**

| Nombre | Tipo | Descripción |
| - | - | - |
| timeoutId | Number | ID del temporizador para usar con `clearTimeout()`. |