Maison > Questions et réponses > le corps du texte
P粉4638111002023-08-28 10:40:20
J'utilise généralement les attributs data-* en HTML.
<div class="service-container" data-service="<?= htmlspecialchars($myService->getValue()) ?>" > </div> <script> $(document).ready(function() { $('.service-container').each(function() { var container = $(this); var service = container.data('service'); // Var "service" now contains the value of $myService->getValue(); }); }); </script>
Cet exemple utilise jQuery, mais il peut être adapté à d'autres bibliothèques ou à du JavaScript simple.
Vous pouvez en savoir plus sur les propriétés des ensembles de données ici : https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement.dataset
P粉5026087992023-08-28 00:24:11
Il existe en fait plusieurs façons de procéder. Certains nécessitent plus de frais généraux que d’autres, et certains sont considérés comme meilleurs que d’autres.
Sans ordre particulier :
Dans cet article, nous examinerons chacune des méthodes ci-dessus, comprendrons les avantages et les inconvénients de chacune et comment les mettre en œuvre.
Cette méthode est considérée comme la meilleure car vos scripts côté serveur et côté client sont complètement séparés.
Avec AJAX, vous avez besoin de deux pages, une sur laquelle PHP génère la sortie et une seconde sur laquelle JavaScript obtient cette sortie :
/* Do some operation here, like talk to the database, the file-session * The world beyond, limbo, the city of shimmers, and Canada. * * AJAX generally uses strings, but you can output JSON, HTML and XML as well. * It all depends on the Content-type header that you send with your AJAX * request. */ echo json_encode(42); // In the end, you need to `echo` the result. // All data should be `json_encode`-d. // You can `json_encode` any value in PHP, arrays, strings, // even objects.
<!-- snip --> <script> fetch("get-data.php") .then((response) => { if(!response.ok){ // Before parsing (i.e. decoding) the JSON data, // check for any errors. // In case of an error, throw. throw new Error("Something went wrong!"); } return response.json(); // Parse the JSON data. }) .then((data) => { // This is where you handle what to do with the response. alert(data); // Will alert: 42 }) .catch((error) => { // This is where you handle errors. }); </script> <!-- snip -->
La combinaison des deux fichiers ci-dessus déclenchera une alerte lorsque le chargement du fichier sera terminé 42
.
Cette méthode n'est pas aussi performante qu'AJAX, mais elle a quand même ses avantages. Il existe toujours une séparation relative entre PHP et JavaScript, dans le sens où il n'y a pas de PHP direct en JavaScript.
来存储信息,因为获取信息更容易超出 inputNode.value
,但这样做意味着 HTML 中存在无意义的元素。 HTML 具有用于表示有关文档的数据的
元素,并且 HTML 5 引入了 data-*
spécifiquement pour les données qui peuvent être lues à l'aide de JavaScript et qui peuvent être associées à un élément spécifique. Avec cela, l'idée est de créer une sorte d'élément qui ne sera pas montré à l'utilisateur, mais qui est visible par JavaScript.
<!-- snip --> <div id="dom-target" style="display: none;"> <?php $output = "42"; // Again, do some operation, get the output. echo htmlspecialchars($output); /* You have to escape because the result will not be valid HTML otherwise. */ ?> </div> <script> var div = document.getElementById("dom-target"); var myData = div.textContent; </script> <!-- snip -->
C'est probablement le plus simple à comprendre.
La mise en œuvre est relativement simple :
<!-- snip --> <script> var data = <?php echo json_encode("42", JSON_HEX_TAG); ?>; // Don't forget the extra semicolon! </script> <!-- snip -->
Bonne chance à vous !