11540 sujets

JavaScript, DOM et API Web HTML5

Bonjour,

Afin d'insérer de manière dynamique des balises open graph dans mon site codé en php, j'ai choisi d'utiliser javascript.
Voici le code :
?>

<script type="text/javascript">

document.getElementsByTagName("head")[0].innerHTML += '<meta content="<?php echo strip($row["title"]); ?> " property="og:title"/><meta content="article" property="og:type"/><meta content="http://fabetrob.aeitpe.fr/www20/index.php?page=news_detail&id=<?php echo $row["id"];?>" property="og:url" /><meta content="AEITPE.fr" property="og:site_name"/><meta content="<?php echo $photo ;?>" property="og:image"/><link rel="image_src" href="<?php echo $photo ;?>" />'

</script>

<?php


Le problème : les balises ont l'air de bien être toutes insérées quand on regarde la source à l'aide de l'outil 'Examiner l'élément' sous Firefox; mais quand on regarde la source via 'Afficher la source', elles n'apparaissent pas.
Au-delà de ça, Le Débogeur de Facebook (http://developers.facebook.com/tools/debug), ce pour quoi j'insère ces balises, ne les voit pas.

Un exemple de page où cela devrait fonctionner : http://fabetrob.aeitpe.fr/www20/index.php?page=news_detail&id=140

Merci par avance de votre aide future,

Fazac
Bonjour,
Pourquoi vouloir les insérer à l'aide de JavaScript et pas directement avec PHP ?

Quand tu fais "Afficher la source" dans Firefox, il ne t'affiche pas le contenu généré, mais le contenu envoyé par le serveur (donc pas le DOM modifié par JavaScript).
Alors ce n'est pas que je ne veux pas les insérer en php mais plutôt que je n'en suis pas capable et pensais que cela allait être relativement simple en javascript.
En effet ma page d'index charge tous les éléments dont le header puis à l'aide de la fonction include, j'inclus la page content.php qui contient notamment le body.

Extrait de index.php :

/* </HEADER> */
$main->headers();

/* <BODY>*/
include('content.php');


La structure php n'étant pas de moi, je n'ai pas réussi à trouver de solution pour inclure via une fonction php, des éléments dans le header qui serait fonction des éléments contenu dans le content.php.

Si cela peut nous aider, voici les fonctions php qui génère le header :


class Website
{
    private $title;
    private $tags;
    private $css;
    private $jsScripts;

    public function __construct($t)
    {
	set_time_limit(0);
	$this->title = $t;
	$this->tags = array();
	$this->css = new Vector();
	$this->jsScripts = new Vector();

	$this->addTag('content-type','text/css; charset=utf-8');
	$this->addTag('Author','...');
	$this->addTag('Description','L&#39;AEITPE est l&#39;Association des Etudiants Ing&eacute;nieurs des Travaux Publics de l&#39;Etat');
	$this->addTag('Expires','never');

    }

[...]
   public function addTag($a,$b)
    {
	$this->tags[$a] = $b;
    }

    public function headers()
    {
	echo '<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"';
	echo '"http://www.w3.org/TR/html4/strict.dtd">';
	echo '<html lang="en" xml:lang="en" xmlns:fb="http://ogp.me/ns/fb#">';
	
	echo "<head>\n";
	echo "<title>$this->title</title>\n";
	foreach($this->tags as $key => $value)
	{
	    echo "<meta http-equiv='$key' content='$value' />\n";
	}
	foreach($this->css->get() as $css)
	{
	    echo "<link type='text/css' href='css/$css' rel='stylesheet' media='screen,projection' />\n";
	}
	foreach($this->jsScripts->get() as $js)
	{
	echo "<script type='text/javascript' src='js/$js'></script>\n";
	}
	
	//Ajout de l'icône du site
	echo '<link rel="icon" href="images/favicon.gif" type="image/gif" >';
	
	//Modération des commentaires Facebook
	echo '<meta property="fb:admins" content="..."/>';
	
	
	echo "</head>\n";
    }



Merci de votre aide et de celle future,

Zen26.5
Oui c'est bien cela.

Edit :
le header étant chargé en amont, le DOM chargé était intouchable via javascript, j'ai choisi de me débrouillé en php et ça fonctionne !

Merci à tous !
Modifié par Fazac (20 Aug 2012 - 19:45)