web-dev-qa-db-fra.com

Inclure une page Web dans une div

Je dois inclure une page Web dans le div de ma page Web. Je veux que quelque chose comme iframe soit fait avec DIV. Fondamentalement, je fournirai une URL à ma div et il devra l'ouvrir à l'intérieur de lui-même ... Avons-nous quelque chose comme ceci en HTML moderne? Je ne peux pas utiliser de cadres, car certains navigateurs ont des problèmes avec les cadres.

htmliframe
8
Varun

Nan. Vous ne pouvez pas incorporer un document HTML complet dans un autre élément div, car il s'agit d'un élément de niveau bloc et le W3C a défini ce qui pourrait être inclus à l'intérieur.

Mais il existe une solution de contournement. Suivez ces étapes:

  1. Obtenez le document en utilisant ajax (jQuery rocks, utilisez-le)
  2. Extrayez le contenu de l'élément <body> et placez-le dans votre élément div
  3. Obtenez tous les liens et le script de l'élément <head> et ajoutez-les à l'élément <head> de votre pgae existant.
4
Saeed Neamati

Essayez d'utiliser un élément <object>:

<div style="margin: 0 auto; width:100%; height:400px;">
    <object type="text/html" data="**URL to page**"
            style="width:100%; height:100%; margin:1%;">
    </object>
</div>
17
Jan

vous devriez utiliser iframe. c'est essentiellement ce que les iframes sont pour. si vous vous en tenez aux navigateurs modernes, ils n'auront aucun problème avec les iframes (pas plus que ce que vous devrez faire face avec div's) ...

3
Headshota

Vous pouvez utiliser iframe ou, si vous décidez d’utiliser la fonction de chargement jQuery ( http://api.jquery.com/load/ ), vous devez éviter le problème de script inter-scripts - vous devez créer une sorte de prise de proxy un aperçu de ceci: WebBrowser Control: Désactiver le filtrage XSS entre sites ou un autre moyen de traiter JS intégralement en HTML

1
kleinohad

Cela aurait dû figurer dans la question elle-même, mais le PO a expliqué que la raison pour laquelle il ne souhaitait pas utiliser un iframe était parce que la communication intertrame n'était pas autorisée. Eh bien, ce n’est rien un proxy + postMessage ne peut pas résoudre.

Je crois qu’il n’ya tout simplement aucun moyen d’incorporer un document complet dans un autre, en conservant des éléments tels que la séparation des styles et des scripts, entre autres, sans utiliser de cadre dans un sens.

0
Alan H.

C'est vraiment une extension de la réponse de Saeed. Pour résoudre les problèmes de script entre sites, vous devez écrire sur votre propre serveur un script qui effectue un appel CURL pour que la page Web soit incorporée. Votre javascript appellera alors ce script, en passant l'URL sous la forme d'un paramètre GET/POST.

Je suis d'accord avec beaucoup d'autres personnes ici que c'est un cas où vous devriez vraiment utiliser un iframe ... Je pense que vous pouvez définir l'iframe sans balise src et y insérer manuellement le contenu. Cela signifierait que vous n'avez pas besoin de prendre les mesures que Saeed a suggérées pour casser la tête et le corps. Cependant, vous avez toujours besoin du script que j'ai décrit pour contourner le script intersite.

0
Endophage