¿Qué hacen estos códigos jQuery?

  • Primera linea:
    • Asignado un valor al elemento variable – var element =
    • El valor asignado selecciona todos los elementos ul de la clase .data que son hermanos de la clase .search-container que no están ocultos y son hijos directos de la clase .data
  • Segunda linea:
    • Selecciona el container variables y todos los elementos que tienen un atributo ‘game-search’ que contiene el valor de la condition variable.
    • Elimina la clase hidden de los elementos coincidentes.
  • Tercera línea:
    • Comprueba si t coincide con la expresión regular global /data/ .
    • Elimina la clase hidden si se cumple la condición.

Como Kurt notó, no es un buen código, es difícil de entender. Sugiera modificaciones a mi respuesta si cree que puedo estar equivocado. ¡Gracias!

  1. Echa un vistazo aquí. Supongo que hide es en realidad una clase, por lo que debería ser el selector css ‘.hide’

    Esto seleccionará cada elemento li donde el padre es un elemento ul que tiene una class ‘datos’ y not una class ‘hide’ y en el que el elemento ul está precedido por un elemento con la class ‘select-container’.

  2. Esto busca todos los elementos que supuestamente coinciden con el selector que es el container variables y que tienen un attribute ‘game-search’ que contiene ( *= ) cualquier condition sea. Luego elimina la class ‘oculta’ de los elementos coincidentes.
  3. Esto comprueba si t coincide con la expresión regular global /data/ . Si lo hace, elimina la class ‘oculta’ de todos los elementos que coinciden con el selector descrito en 1 (aunque, supongo que oculto debería estar entre comillas).

Como postdata, creo que este código hace un trabajo objetivamente pobre para lograr lo que está tratando de lograr. La razón por la que es confuso es porque lo es. Algunas cosas en particular:

  1. El operador ~ es muy frágil y difícil de entender. Una relación descendiente: $('p div') , o mejor: $('p').find('div') , es generalmente más semántica y a prueba de futuro.
  2. not agrega también una complejidad innecesaria. Prefiero el hide clase mutuamente excluyente show.
  3. game-search probablemente debería ser un atributo de datos HTML5.
  4. Con la forma en que se t.match(/data/g) , probablemente sea mejor con String.prototype.test() . Devuelve verdadero o falso si hay una coincidencia en lugar de una matriz o nulo, que es todo lo que necesita aquí. También es más rápido. En consecuencia, tampoco debería necesitar la bandera global “g” en la expresión regular.

Creo que Kurt Marcinkiewicz y Tanmay Naik cada parte de este código.

Agregaría más que este fragmento de código es muy pequeño para extraer cualquier descripción general de su propósito.

Pero parece que este código es para el menú de navegación. Y recomendaría usar más css que JavaScript para manejar tales casos. Usar una clase oculta pero ponerlo con JavaScript no tiene mucho sentido.