Añadir reinicio JavaScript
Corto y dulce
Puede utilizar la función Restablecer JavaScript para eliminar el código JavaScript que haya añadido. Esta función es especialmente útil para aplicaciones de una sola página (SPA) si la aplicación no fuerza una nueva carga de página al cambiar entre distintas páginas. En consecuencia, los cambios de JavaScript permanecen visibles en la nueva página, aunque ya no se aplique la orientación del experimento. La función de reinicio de JavaScript se ejecuta poco antes de cambiar a la nueva página.
Ejemplo de aplicación para JavaScript Reset
Un banner se crea utilizando JavaScript y debe entregarse en una página específica. Cuando se cambia la página, se sigue entregando, a pesar de que la orientación en la página no se aplica.
Se utiliza el siguiente código JavaScript:
window.varify?.helpers?.waitFor('main', (main) => {
if (!main || document.querySelector('.demo-banner')) return;
const css = `.demo-banner{box-sizing:border-box;max-width:800px;margin:12px auto;padding:12px 40px 12px 12px;background:#f33;color:#fff;border-radius:6px;font:14px/1.4 system-ui,sans-serif;position:relative}
.demo-banner .close{position:absolute;top:6px;right:8px;border:0;background:transparent;color:#fff;font-size:18px;cursor:pointer;line-height:1}
.demo-banner a{color:#fff;text-decoration:underline}`;
const style = document.createElement('style');
style.textContent = css;
document.head.appendChild(style);
const html = `
<div class="demo-banner" role="region" aria-label="Demo Banner">
<button class="close" aria-label="Close">×</button>
<strong>Dummy Banner</strong> — Placeholder text. <a href="#">Learn more</a>
</div>`;
main.insertAdjacentHTML('beforebegin', html);
const banner = document.querySelector('.demo-banner');
banner.querySelector('.close').addEventListener('click', () => banner.remove());
});
Puede utilizar el siguiente código JavaScript de restablecimiento para asegurarse de que el banner se elimina antes del cambio de página:
const elementsToRemove = document.querySelectorAll('#systemchange-styles, .systemchange');
[...elementsToRemove].forEach(element => element.remove());