web-dev-qa-db-fra.com

Un iframe vide src est-il valide?

Je veux qu'un iframe ait initialement src vide, puis une fois la page chargée; appelez une fonction JS puis définissez la valeur src sur une valeur réelle ..

Ainsi est <iframe src="#" /> valide OR Dois-je utiliser quelque chose d'autre comme javascript:;, etc

javascripthtmlcssiframe
66
testndtv

juste <iframe src='about:blank'></iframe>

91
ariel

Le brouillon HTML 5, section 4.8.2 , dit (mon emphase):

L'attribut src donne l'adresse d'une page que le contexte de navigation imbriqué doit contenir. L'attribut, s'il est présent, doit être une URL valide non vide potentiellement entourée d'espaces.

Selon RFC 3986 , les URL valides doivent commencer par nom du schéma , et les références relatives ne peuvent consister uniquement en fragment .

Donc, # n'est pas une URL valide et ne doit pas être utilisé comme valeur de l'attribut src.

Utilisez about: blank à la place.

47
Frédéric Hamidi

Non, il est non valide pour spécifier un src iframe vide.

Tu devrais utiliser <iframe src="about:blank" />.

# est censé être une référence à une ancre dans la page actuelle (ou, souvent utilisé comme schéma de routage lorsque vous travaillez avec AJAX requêtes. L’utiliser comme source d’un iframe n’aurait aucun sens, puisqu’un iframe ne fait pas référence au contenu de la page en cours et n’est pas utilisé avec les requêtes AJAX.

about:blank est un standard multi-navigateurs permettant d’afficher un document vierge.

Mise à jour du 8 juin 2012:

Il semble que la spécification 'living' ne rend plus une iframe invalide si l'attribut src est manquant:

Si, lors de la création de l'élément, l'attribut srcdoc n'est pas défini et que l'attribut src n'est pas non plus défini ou défini, mais que sa valeur ne peut pas être résolue, le contexte de navigation restera à la page initiale environ: vierge.

Cependant, si ces deux attributs ne sont pas définis, le contexte de navigation sera par défaut à about:blank. Pour assurer une compatibilité ascendante correcte, il est recommandé d’être verbeux et, pour le moment, de fournir le about:blank url.

23
Aron Rotteveel

Il semble que vous pouvez également laisser complètement le src:

http://dev.w3.org/html5/spec/Overview.html#the-iframe-element

Si, lors de la création de l'élément, l'attribut srcdoc est non défini et si l'attribut src est également set ou set mais sa valeur ne peut pas être résolue, le contexte de navigation restera à la page initiale environ: vierge.

10
rjmunro

Dans le cadre de la norme sur les schémas d'URI, about: blank est probablement la meilleure option car il prend très bien en charge les navigateurs.

about: blank Renvoie un document HTML vierge avec le type de support text/html et encodage de caractères UTF-8. Ceci est largement utilisé pour charger des pages vierges dans des contextes de navigation, tels que des iframes au format HTML, qui peuvent ensuite être modifiés par des scripts. Vous pouvez voir plus loin ici

1
Selay

Vous pouvez utiliser about:blank dans l'attribut src (comme mentionné précédemment par ariel), sinon une erreur serait générée lors de la publication depuis une page sécurisée.

Une page sécurisée https jetterait une erreur de données éventuellement non sécurisées sur le site Web sécurisé.

1
Naveed Butt

Vous pouvez essayer d'ajouter l'iframe via Javascript, de sorte que vous n'auriez pas besoin d'un blanc dans le code HTML:

(exemple jQuery)

<script type="text/javascript">
$().ready(function() {
    $("<iframe />").attr("src", "http://www.bbc.co.uk/").appendTo("body");
});
</script>

L'ajout de l'iframe avec Javascript permet une dégradation progressive - les utilisateurs sans Javascript ne verront pas d'iframe vierge.

1
whostolemyhat

Si vous ne voulez pas utiliser about:blank vous pouvez utiliser javascript comme src pour votre iframe comme dans l'exemple suivant:

<iframe name="TV" id="tv" style="width:100%; background: #800000" src="javascript:document.write('<h3>Results Window</h3>')"></iframe>

L'exemple ci-dessus initialisera un iframe avec un arrière-plan marron contenant un simple message <h3>Results Window</h3>. Cependant, les cibles de vos liens doivent être égales à l'attribut iframename, c'est-à-dire i.e dans cet exemple TV.

1
SaidbakR

Pour le compte rendu

Disons le prochain exemple (Firefox 58 mais peut être présent dans tous les navigateurs).

<link href="css.css" rel="stylesheet" type="text/css"/>
<iframe src='about:blank'></iframe>

Iframe est chargé AVANT le css pour que le rendu de la page soit visible avant que le css ne soit chargé. C'est à dire. pendant une fraction de seconde, la page a l'air sans css.

Au lieu:

<link href="css.css" rel="stylesheet" type="text/css"/>
<iframe src='blank.html'></iframe>

Cela fonctionne très bien, le css est chargé et l’iframe est chargé finalement.

0
magallanes