almacenar datos adicionales en una página HTML

Question

Quiero guardar algunos datos adicionales en una página HTML y en la demanda por parte del cliente utilizar estos datos para mostrar diferentes cosas usando JS. ¿Cómo debo guardar estos datos? en divs invisibles, o algo más? ¿hay alguna manera estándar?

Answer 1

Yo diría que si estás usando JS para visualizarlo, debe guardarlo en algún tipo de estructura de datos JS (dependiendo de lo que quiere hacer). Si lo que desea es cambiar un elemento por otro, sin embargo, invisible [inserte el tipo de elemento de aquí] puede funcionar bien también.

Answer 2

No creo que hay una manera estándar; Me almacenarlos en el código fuente de JavaScript.

Answer 3

Uno de:

1. campos de entrada ocultos (si quieres enviarlo de nuevo al servidor); o
2. Los elementos ocultos en la página (oculto por CSS).

Cada uno tiene aplicaciones.

Si utiliza (1) a, por ejemplo, identificar algo sobre el envío del formulario, no debe confiar en él en el servidor (como todo lo que viene del cliente). (2) es más útil para cosas como consejos "ricos" de herramientas, cuadros de diálogo y otros contenidos que normalmente no es visible en la página. Por lo general, el contenido está ya sea hace visible o clonado según el caso, posiblemente siendo modificada en el proceso.

Answer 4

Si tengo que poner algo de información en el html que será utilizado por el Javascript a continuación utilizo

<input id="someuniqueid" type="hidden" value="..." />

Answer 5

divs invisible es generalmente el camino a seguir. Si sabe lo que hay que demostrar en primer lugar, se puede mejorar la experiencia del usuario, única carga que en un principio, a continuación, utilizando una llamada AJAX para cargar los elementos restantes de la página.

Answer 6

Es necesario para almacenar cualquier tipo de datos que estructurarse como HTML en una estructura HTML. Yo diría que para construir adecuadamente los datos o contenidos que la intención de mostrar como HTML adecuado mostrar en la página. Asegúrese de que todo está completo, semántica y accesible. A continuación, asegúrese de que el CSS presenta los datos correctamente. Cuando haya terminado de añadir un estilo en línea de "display: none;" a la parte superior del contenedor que desea tener dinámico aparecen. Ese estilo en línea puede ser leído por lectores de texto para que no se lea hasta el estilo de visualización adecuada sobre los cambios de los elementos.

A continuación, utilice JavaScript para cambiar el estilo del contenedor cuando esté listo:

var blockit = function () {
    var container = document.getElementById("containerid");
    container.style.display = "block";
};

Answer 7

Para pequeñas cantidades de datos adicional, puede usar HTML5 "datos - *" atributo

<div id="mydiv" data-rowindex="45">

entonces tener acceso a theese campos con métodos de datos jQuery

$("#mydiv").data("rowindex")

o seleccione el elemento por el valor del atributo

$('div[data-rowindex="45"]')

adjuntar datos adicionales para elemento

$( "body" ).data( "bar", { myType: "test", count: 40 } );