mémoriser des données supplémentaires sur une page html

StackOverflow https://stackoverflow.com/questions/1483263

  •  18-09-2019
  •  | 
  •  

Question

Je veux stocker des données supplémentaires sur une page html et sur demande par le client utilise ces données pour montrer des choses différentes en utilisant JS. comment dois-je stocker ces données? dans divs Invisible, ou autre chose? est-il une manière standard?

Était-ce utile?

La solution

Je dirais que si vous utilisez JS pour l'afficher, vous devez l'enregistrer dans une sorte de structure de données JS (en fonction de ce que vous voulez faire). Si vous voulez juste d'échanger un élément pour un autre bien, [insérer le type d'élément ici] invisible peut bien fonctionner aussi.

Autres conseils

Je ne pense pas qu'il y ait un moyen standard; Je les stocker dans le code source JavaScript.

L'un:

  1. champs d'entrée cachés (si vous voulez soumettre au serveur); ou
  2. éléments cachés sur la page (cachée par CSS).

Chacun a des applications.

Si vous utilisez (1), par exemple, identifier quelque chose au sujet de la soumission de formulaire, vous ne devriez jamais compter sur elle sur le serveur (comme tout ce qui vient du client). (2) est le plus utile pour des choses comme infobulles « riches », les boîtes de dialogue et d'autres contenus qui ne sont pas normalement visible sur la page. Habituellement, la teneur est soit rendue visible ou clone selon le cas, éventuellement modifiée dans le processus.

Si je dois mettre des informations dans le code HTML qui sera utilisé par le javascript puis-je utiliser 

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

divs Invisible est généralement le chemin à parcourir. Si vous savez ce qui doit être montré d'abord, vous pouvez améliorer l'expérience utilisateur en ne chargeant que d'abord, puis à l'aide d'un appel AJAX pour charger les autres éléments sur la page.

Vous devez stocker tout type de données à structurer au format HTML dans une structure HTML. Je dirais que de construire correctement les données ou le contenu que vous souhaitez afficher comme bon HTML afficher sur la page. Assurez-vous que tout est complet, sémantique et accessible. Assurez-vous ensuite que le CSS présente les données correctement. Lorsque vous avez terminé d'ajouter un style en ligne de « display: none; » au conteneur supérieur vous souhaitez voir apparaître dynamiquement. Ce style en ligne peut être lu par les lecteurs de texte afin qu'ils ne la lire que le style d'affichage approprié sur les changements d'éléments.

Ensuite, utilisez JavaScript pour changer le style du conteneur lorsque vous êtes prêt: 

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

Pour de petites quantités de données supplémentaires que vous pouvez utiliser données HTML5 » - * » attribut 

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

accéder puis theese champs avec méthodes de données jQuery 

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

ou un élément de sélection de valeur d'attribut 

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

attacher des données supplémentaires à l'élément 

$( "body" ).data( "bar", { myType: "test", count: 40 } );
Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top