2010-11-10 9 views
23

estoy pensando en el uso de atributos personalizados en jQuery para evitar el uso de atributos de clase o id, para no interferir con los diseñadores del HTML.Jquery encargo

Teniendo en cuenta esta idea, el HTML debería ser piezas como:

<ul Jquery="CommonUl"> 
    <li Jquery="CommonLi"></li>  
    <li Jquery="CommonLi"></li> 
    <li Jquery="CommonLi"></li> 
    <li Jquery="CommonLi"></li> 
    <li Jquery="CommonLi"></li> 
</ul> 
  • ¿Cree que este es un buen enfoque?

  • ¿Cuál es su opinión acerca de la validación del W3C de estos atributos personalizados?

  • ¿Conoce alguna manera de programar con jQuery sin interferir con el trabajo de los diseñadores html?

  • Sobre el rendimiento, supongo que con los atributos de clase o identificadores, los selectores de jquery son más rápidos que usar un atributo personalizado y funciones de filtrado como "contiene, etc ...". ¿Es esto correcto?

+2

Mi opinión acerca de la validación W3C para esto es que se fallará. :) ¿Estás familiarizado con '.data()' de jQuery? (Sin embargo, no será útil si necesita almacenar los datos directamente en el marcado) –

+2

¡De hecho, @Pekka lo hará, con jQuery 1.4.3! Una llamada a '.data (" foo ")' recogerá el valor de 'data-foo =" value "' en un elemento. – Pointy

+1

@Pointy, sí, pero 'data- *' no es válido en HTML 4 ... –

Respuesta

81

Usted puede hacer esto, utilizar data- attributes aunque (part of the HTML5 specification), así:

<li data-something="CommonLi"></li> 

jQuery incluso se ha incorporado en el apoyo a estos en 1.4.3+, por ejemplo:

$("li").data("something") //"CommonLi" 

Para sus otras preguntas:

  • Ellos validar si se trata de HTML5 - pero no se ruptura nada en HTML 4
  • esto no debe interferir con el diseñador, pero va a depender de lo que diseñador
  • Si eres de un elemento, el rendimiento es el mismo que el de cualquier otro atributo
+0

Sin embargo, esto no será válido en HTML 4, por lo que si es importante admitir navegadores antiguos y ser válido para W3C, no es una opción triste. Si eso no es un problema, esta es la mejor manera de ir –

+1

@Pekka - Estoy de acuerdo, pero ser 100% válido no es tan importante como ser 100% funcional ... si no hubiera una brecha en la especificación donde estos fueron necesarios, no se habrían agregado en HTML5 :) Al subir al formato HTML5 DOCTYPE debería ocuparse de ambos lados aquí. –

+0

Hola, gracias de antemano ... Excelente respuesta. Lo que pasa es que probablemente no usemos HTML 5, aparentemente no estará terminado hasta 2012. – Jose3d

1

Yo personalmente recomendaría usar el método incorporado jquery para guardar datos con cada elemento. siguiente es el fragmento de código para guardar los datos:

$("ul").data("CommonUl"); 
$("li").data("CommonLi"); 
+0

Antes que nada, gracias ... No sabía de esta manera el elemento foreach de los datos de la tienda. El caso es que probablemente no necesite decir algo como: "todos los ul's y li's tendrán adjuntados los siguientes datos", en cambio habrá algunos elementos específicos (tal vez en la página haya 4 ul, y me gustaría postular) esto a uno y no por posición) ... Atentamente. – Jose3d

8

si usted está planeando tener varios atributos que sugiero para establecer un atributo de espacio de nombres único, por ejemplo,

<li data-yourapp>...</li> 

y utilizar ese atributo como una tabla hash

$("li").data("yourapp", { 
    points : 2000, 
    life : 1, 
    weapons : { 
     firegun : 0, 
     missiles : 12 
    } 
}); 

de esta manera se reducirá el acceso de elemento y se va a recuperar todos los datos personalizados una vez

+0

Bien ... no sabía que podrías hacer esto. – Adam

Cuestiones relacionadas