jQuery Selector Optimizer
Breve descripción general
Con la mayoría de los elementos de WalkMe, es posible introducir libremente los selectores de jQuery para seleccionar elementos. La biblioteca de jQuery ha existido durante bastante tiempo, pero su sintaxis y forma de escribir los selectores ha cambiado con el tiempo.
Para los usuarios que no están familiarizados con la última sintaxis y utilizan una forma antigua de escribir selectores de jQuery, esto a veces puede causar un tiempo de evaluación más largo. Esto se convierte en un problema cuando los usuarios tienen mucho contenido con selectores antiguos.
Queremos mejorar el rendimiento de WalkMe para encontrar elementos en la página y ayudarte a escribir selectores más eficientes.
El "jQuery Optimizer" detecta si un selector específico que has escrito se puede reescribir con una sintaxis más moderna que evalúe más rápido. Cuando lo hace, actualiza automáticamente el valor en el campo con el selector optimizado, dejando la opción de restablecer el cambio manualmente.
Cómo funciona
Esta función está disponible automáticamente para cualquier desplegable que tenga la opción "Definir cómo identificar el elemento" dentro de la configuración de ese desplegable en particular:
Ejemplos de optimización
| Antes de la optimización | Después de la optimización |
|---|---|
| [class="foo"] | .foo |
| [class="foo bar"] | .foo.bar |
| [id="foo"] | #foo |
| [class="foo bar"] [id="foo"] | .foo #bar |
| [class="foo"].bar:not([class="foo-bar"]) | .foo.bar:not(.foo-bar) |
| [class="foo"][class="bar"]:not([class="foo-bar"]) | .foo.bar:not(.foo-bar) |
Pasos para utilizar el Optimizador de JQuery.
- Abre cualquier desplegable con un elemento seleccionado.
- Haz clic en la pestaña Elemento seleccionado:
- Selecciona el selector de jQuery en la sección "Define cómo identificar el elemento":
- Rellena el valor escrito a la antigua, por ejemplo: [class="foo bar"], y haz clic fuera del campo de entrada:
- ¡Mira la magia de la optimización del selector!