Les outils d’une stratégie de social selling | La dernière version de Gmail nourrie au machine learning | Comment sécuriser son stockage cloud | CleverPDF : une suite d’outils complète et gratuite pour convertir et modifier ses fichiers PDF | L’impact des réseaux sociaux en BtoB | Est-ce que la publicité imprimée est toujours pertinente pour votre entreprise | Google déclare la guerre aux SMS avec Chat | Monitorer vos sites : MainWp ou ManageWP | Yahoo vend son service de stockage photos Flickr à SmugMug | McDonald's UK basculerait d'Atos à Capgemini pour son support IT | 5 Compétences Dont Vous Avez Besoin Pour Mieux Écrire Votre Code | 5 obligations légales pour les sites internet en 2018 | Trelloist : un outil de gestion des tâches pour ceux qui aiment Trello et Todoist | Comment savoir si Facebook a partagé vos données personnelles avec Cambridge Analytica | Clouds low cost : lequel est le moins cher | Instagram Focus, pour flouter l’arrière-plan des photos automatiquement | Les 8 Tech Trends qui vont marquer l’année | Emailing : comment être conforme au RGPD | Text2MindMap, un outil gratuit pour faire une mindmap en ligne | Gmail : un nouveau design et de nouvelles fonctionnalités sur le web | WebAuthn, la norme Web qui va permettre de se connecter aux différents services sans mot de passe | Cisco ajoute des options de déploiement virtuel et cloud à son service Tetration | Mark Zuckerberg fait face au Sénat pour son grand oral | Community Management : Comment ne pas lasser ses followers | Linux 4.16 mieux armé contre Meltdown et Spectre | Stack Overflow dresse le bilan de l’employabilité des développeurs | Goo.gl, le raccourcisseur d’URL de Google, c’est terminé | Google News priorisera l’actualité des médias auxquels vous êtes abonné | 4 secrets d’experts pour booster votre référencement local en 2018 | Google déploie une batterie d'outils de sécurité cloud |

51 Visiteurs aujourd'hui

Abonnez-Vous

La différence entre les éléments iframe, embed et object

1358 Vues 2018-02-26 Html5, iframe, embed, object Solutions techniques

La différence entre les éléments iframe, embed et object

HTML5 définit plusieurs éléments de contenu intégrés, qui, d'un point de vue d'oiseau, semblent être très similaires au point d'être en grande partie identiques.

Quelle est la différence entre iframe , embed et object ?

Si je veux intégrer un fichier HTML d'un site tiers, lequel de ces éléments pourrais-je utiliser, et en quoi diffèrent-ils?

‹iframe›





L'élément iframe représente un contexte de navigation imbriqué. HTML 5 standard - "L'élément ‹iframe› "

Principalement utilisé pour inclure des ressources provenant d'autres domaines ou sous-domaines, mais peut également être utilisé pour inclure du contenu provenant du même domaine. La force de ‹iframe› est que le code incorporé est 'live' et peut communiquer avec le document parent.

‹embed›





Standardisé en HTML 5, il était auparavant un tag non standard, qui a certes été implémenté par tous les principaux navigateurs. Comportement avant HTML 5 peut varier ...

L'élément embed fournit un point d'intégration pour une application externe (généralement non-HTML) ou un contenu interactif. ( HTML 5 standard - "L'élément ‹embed› " )

Utilisé pour incorporer du contenu pour les plugins du navigateur. Les exceptions à ceci sont SVG et HTML qui sont traitées différemment selon la norme.

Les détails de ce qui peut et ne peut pas être fait avec le contenu incorporé dépendent du plugin du navigateur en question. Mais pour SVG vous pouvez accéder au document SVG embarqué du parent avec quelque chose comme:

svg = document.getElementById("parent_id").getSVGDocument();


Depuis l'intérieur d'un document SVG ou HTML intégré, vous pouvez atteindre le parent avec:

parent = window.parent.document;


Pour le HTML incorporé, il n'y a aucun moyen d'obtenir le document incorporé du parent (que j'ai trouvé).

‹object›





L'élément ‹object› peut représenter une ressource externe, qui, selon le type de la ressource, sera traitée comme une image, comme un contexte de navigation imbriqué, ou comme une ressource externe à traiter par un plugin. ( HTML 5 standard - "L'élément ‹object› " )

Conclusion



Sauf si vous incorporez du SVG ou quelque chose de statique, vous devriez probablement utiliser ‹iframe› . Pour inclure SVG, utilisez ‹embed› (si je me souviens bien, ‹object› ne vous laissera pas scripter *). Honnêtement, je ne sais pas pourquoi vous utiliseriez ‹object› sauf pour les navigateurs plus anciens ou flash (avec lesquels je ne travaille pas).

Comme indiqué dans les commentaires ci-dessous; les scripts dans ‹object› vont s'exécuter mais les contextes parent et enfant ne peuvent pas communiquer directement. Avec ‹embed› vous pouvez obtenir le contexte de l'enfant du parent et vice versa. Cela signifie qu'ils peuvent utiliser des scripts dans le parent pour manipuler l'enfant, etc. Cette partie n'est pas possible avec ‹object› ou ‹iframe› où vous devrez configurer un autre mécanisme à la place, tel que l'API JavaScript postMessage .

Une autre raison d'utiliser l' object sur iframe est que les sous-ressources object (quand un ‹object› effectue HTTP requêtes HTTP ) sont considérées comme passive/display en termes de Mixed content , ce qui signifie qu'il est plus sécurisé lorsque vous devez avoir un Mixed content .

Le contenu mixte signifie que lorsque vous avez https mais que votre ressource provient de http .


1358 Vues 2018-02-26 Html5, iframe, embed, object Solutions techniques




Source


Articles Récentes




Aller à l'essentiel pour maitriser le Développement web

Cours de Développement Web en ligne par MEZGANI SAID

Actualités national et international

Trouve votre futur Métier

Trouve votre futur Métier

Articles Récentes