Dans l'article précédent, il parle de la stratégie homologue du navigateur, c'est-à-dire empêchant les méthodes et les attributs de l'autre d'accéder aux pages de l'autre et d'expliquer la solution à la solution aux problèmes croisés des stratégies homologues: Agence sous-domaine , JSONP, JSONP, CORS. Cet article explique en détail la fenêtre HTML5.PostMessage.
API HTML5 Window.PostMessageHTML5 Window.PostMessage est une API de message basée sur l'événement sûr.
Message d'envoi de postmessageLa méthode de postmessage est appelée à la fenêtre source qui doit envoyer un message pour envoyer un message.
FenêtreLa fenêtre source peut être un objet de fenêtre global ou le type de fenêtre suivant:
Iframe dans la fenêtre du document:
var iframe = document.getElementById ('my-iframe');Fenêtre JavaScript Open Pop -Up:
var win = window.open ();
La fenêtre du père de la fenêtre actuelle du document:
var win = window.parent;
Ouvrez la fenêtre du document actuel:
var win = window.opner ();
Après avoir trouvé l'objet de fenêtre source, vous pouvez appeler l'API PostMessage pour envoyer un message à la fenêtre cible:
`` `Win.postMessage ('Hello', 'ttp: //jhssdemo.duapp.com/');` `` `` `` `` ``La fonction postmessage reçoit deux paramètres: le premier est le message à envoyer, et le second est la source de la fenêtre source.
Remarque: Seulement lorsque la source de la fenêtre cible est adaptée à la valeur du paramètre source réalisée dans la fonction de postmessage, le message peut être reçu.
Recevoir des messages postmessagesPour recevoir des messages de la fenêtre source précédente via PostMessage, il vous suffit d'enregistrer l'événement de message dans la fenêtre cible et de lier la fonction de surveillance des événements pour obtenir le message dans le paramètre de fonction.
Windows.onload = fonction () {var text = document.getElementyid (txt '); + e.origin); } if (window.addeventListener) {// Enregistrez l'événement de message pour la fenêtre et liez la fenêtre de la fonction de surveillance.AdDeventRristEner ('message', recomemsg, false);} else {window.at tachevent ('message', recomemsg) ;}};La fonction de surveillance des événements de message reçoit un paramètre, une instance d'objet d'événement, qui a trois attributs:
Fenêtre
<! # cccccc;} </ style> </ head> <body> <Button id = btn> ouvrir </fontissage> <Button ID = Send> Send </ Button> <! jhssdemo.duapp.com/demo/h5_postMessage/win.html id = alternative> </ iframe> <br/> <br/> "<input type = Button Value = Envoyer à child.com id = sendMessage /> <Script> Window.onload = function () {var btn = document.getElementyid (btn '); Fenêtre via Window.Open (http: //jhssdemo.duapp .com / démo / h5_postMessage / win.html ',' popup ');: // jhssdemo. // Envoi Data Document.getElementById (autre chose) .ContentWindow .PostMerSage (autrewin) D (message). ;}; </cript> </ body> </html>Vitre cible Win.html
<! ;} </ style> </ head> <body> <h1> La nouvelle fenêtre </h1> <div id = txt> </div> <cript> window.onload = function () {var text = document. (Txt '); (norigin: + e.origin); Pour l'événement de message et lier la fonction de surveillance Window.AddeventListener ('message', receivemsg, false);} else {window.attachevent ('message', recomemsg);}}; " revoirGrâce à l'étude de cet article, j'ai appris à utiliser l'API PostMessage pour utiliser HTML5 pour communiquer entre les fenêtres, et je sais également qu'elle peut être utilisée pour réaliser la communication du domaine croisé; comme IE7-, vous pouvez l'utiliser.
Ce qui précède est tout le contenu de cet article.