str_replace poussé

Version imprimable

Voir 40 message(s) de cette discussion en une page

14/06/2011, 14h20
aa1807

str_replace poussé

Bonjour tout le monde voici mon problème:

J'ai un éditeur web qui génère du code HTML et pour une image insérée ils fait le code suivant:

Code:

<img src="xxx" style="width: 200px; height: 150px; ..... etc" />

J'aimerais effacer le "style=" et les points virgules afin d'obtenir un:

Code:

<img src="xxx" width="200" height="150" ..... etc" />

Ceci juste pour les balise <img> !

Pouvez vous m'aider svp? J'essaie de m'en sortir avec la doc mais j'ai du mal...

Merci d'avance
14/06/2011, 14h41
roduce
salut, petit indice, utilise deux tableaux
un tableau $old
et un tableau $new.
tu fais correspondre la clé du tableau pour les remplacement .
exemple
Code:

1 2 $old[0] // chaine recherchée $new[0] //chaine remplacée
et dedans tu inclus un effacement de style="
et du guillemet de fin
et après tu remplace les : par des =
et tu supprimes les ;
je te laisse chercher la suite, c'est + formateur ;)
14/06/2011, 14h52
Benjamin Delespierre
Hello

Fais donc ça avec une regexp, c'est encore ce qu'il y a de plus puissant dans ce cas.
Code:

1 2 $xhtml = '<img src="xxx" style="width: 200px; height: 150px;" width="100" alt="test" />'; var_dump(preg_replace('#(<img.+)( style="[^"]*")(.*/>)#', '$1$3', $xhtml));
Les editeurs graphiques et autres dreamweaver sont à éviter, le code produit n'est jamais bon.

Enjoy.
14/06/2011, 15h25
aa1807

Merci à tous les deux, mais il me semble que la 2ème solution est plus adéquate effectivement car la première me bloque au niveau où je ne sais pas comment effectuer ce str_replace sur une portion du code html (que sur les balise <img> d'un textarea).

En fait il s'agit d'un CKeditor sur un textarea et non un éditeur graphique :)

J'ai testé le code que tu m'as donné, il supprime carrément tout le style! il faut que je regarde comment extraire les infos..

Et voilà:
Code:

1 2 3 4 5 6 7 $xhtml = '<img src="xxx" alt="yyy" style="width: 300px; height: 80px;" title="zzz" />'; $pattern = '#(<img .*) style="[^"]*width: ([0-9]+)px;[^"]*height: ([0-9]+)px[^"]*" (.*/>)#'; $replace = '$1 width="$2" height="$3" $4'; var_dump(preg_replace($pattern, $replace, $xhtml));
Ce n'est peut être pas la façon la plus optimale de faire... Peut être que quelqu'un de plus calé que moi en regexp apporter quelques améliorations.

14/06/2011, 15h37
stealth35

moi j'ai une question :

A quoi ça sert ?
14/06/2011, 15h41
aa1807

Citation:

Envoyé par stealth35

moi j'ai une question :

A quoi ça sert ?

En fait c'est un logiciel qui permet de générer des pages HTML pou pouvoir réutiliser ces pages sur un autre logiciel qui ne prend pas en compte les "style" c'est compliqué je sais...
14/06/2011, 15h44
stealth35

Citation:

Envoyé par aa1807

En fait c'est un logiciel qui permet de générer des pages HTML pou pouvoir réutiliser ces pages sur un autre logiciel qui ne prend pas en compte les "style" c'est compliqué je sais...

arf galère ....

:calim2:
14/06/2011, 15h45
Benjamin Delespierre

Aïe, Stealth m'a vu en train de manipuler des flux HTML avec des regexp, il va me taper :sm:
14/06/2011, 15h48
aa1807

Hehe, en tout cas merci beaucoup Benjamin. Il suffit maintenant de ne pas indiquer width et height mais de faire quelque chose de général pour toute sorte de paramètre (border etc). Je vais chercher, mais si quelqu'un a une autre solution ou qui peut aider pour la suite je suis preneur :)
14/06/2011, 15h48
stealth35

Citation:

Envoyé par Benjamin Delespierre

Aïe, Stealth m'a vu en train de manipuler des flux HTML avec des regexp, il va me taper :sm:

plus tard ;)

la ça touche au CSS, donc c'est plus compliquer,
un jour je ferai SAC en PHP.
14/06/2011, 15h52
roduce

J'y pense pour ton système jette un coup d'oeil du coté des outils bbcode. Tu peux ptet trouver quelque chose d'intéressant .

Après c'est une idée en l'air.
Sinon ce que tu peux faire dans ton traitement c'est isoler dans une variable ce qui est entre <img et le prochain />
et ne parser que le contenu.
14/06/2011, 16h12
Benjamin Delespierre

Citation:

Hehe, en tout cas merci beaucoup Benjamin. Il suffit maintenant de ne pas indiquer width et height mais de faire quelque chose de général pour toute sorte de paramètre (border etc). Je vais chercher, mais si quelqu'un a une autre solution ou qui peut aider pour la suite je suis preneur

Tu aurais dû le dire dès le départ. Parce que là c'est de la transcription de propriétés CSS en attributs HTML si l'équivalence est possible (on s'en sort bien avec width et heigth mais pour border c'est une autre histoire), c'est un peux plus difficile qu'une bête manipulation de chaine...

Citation:

Envoyé par Benjamin Delespierre

Tu aurais dû le dire dès le départ. Parce que là c'est de la transcription de propriétés CSS en attributs HTML si l'équivalence est possible (on s'en sort bien avec width et heigth mais pour border c'est une autre histoire), c'est un peux plus difficile qu'une bête manipulation de chaine...

Alors attendez, j'ai dit une betise en passant... Il me suffit juste de sortir le height width et float, le reste est pris en compte (me demandez pas pourquoi... mystère)
Donc en fait ta solution me convient sauf que, lorsque je l'utilise il sort pas le float!

La solution serait je pense de faire un truc du genre :
Code:

1 2 3 4 5 $xhtml = '<img src="xxx" alt="yyy" style="width: 300px; height: 80px; float: left;" title="zzz" />'; $pattern = '#(<img .*) style="[^"]*width: ([0-9]+)px;[^"]*height: ([0-9]+)px;[^"]*float: (\w+);[^"]*" (.*/>)#'; $replace = '$1 width="$2" height="$3" float="$4" $5'; var_dump(preg_replace($pattern, $replace, $xhtml));
sauf que ça ne marche pas...

14/06/2011, 16h26
stealth35

pour le float c'est align

cherche pas a faire ça en un seul coup ;)
14/06/2011, 16h51
Benjamin Delespierre

Oui enfin la propriété CSS float n'a pas exactement la même valeur que l'attribut align des balises inline. Pour être plus précis, quelle que soit la valeur de la propriété align, l'élément reste dans le flux alors qu'avec le positionnement flottant, il sort. La propriété CSS qui correspond à align est vertical-align.
14/06/2011, 16h56
stealth35

Citation:

Envoyé par Benjamin Delespierre

La propriété CSS qui correspond à align est vertical-align.

non c'est valign qui correspond vertical-align
14/06/2011, 17h20
aa1807
Alors voici la meilleure solution que j'ai trouvé, je laisse le float dans un style qui ne fonctionne pas mais bon au moins le height et le width y sont plus... :(
Code:

1 2 3 $pattern = '#(<img .*) style="[^"]*width: ([0-9]+)px;[^"]*height: ([0-9]+)px;(.*/>)#'; $replace = '$1 width="$2" height="$3" style ="$4"'; $content = preg_replace($pattern, $replace, $content);
Je n'arrive pas à sortir le float.. pour info je pense que l'align fait l'affaire, la valeur du float ne peut être que right ou left dans ce cas et c'est pour mettre l'image à gauche et à droite d'un texte, align ça le fait!

tien

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
$source = <<<HTML
<img src="xxx" style="width: 200px; height: 150px; float:left" width="100" alt="test" />
<img src="xxx" style="width: 500px; height: 300px; float:right" width="100" alt="test" />
HTML;
 
$doc = new DOMDocument();
 
$frag = $doc->createDocumentFragment();
$frag->appendXML($source);
 
$doc->appendChild($frag);
 
$images = $doc->getElementsByTagName('img');
 
foreach($images as $image)
{
    preg_match_all('/(?P<name>[^:\s]+)\:\s*(?P<value>[^;\s]+);?/', $image->getAttribute('style'), $matches);
 
    $styles = array_combine($matches['name'], $matches['value']);
 
    foreach($styles as $name => $value)
    {
    	if($name === 'float')
    	{
    	    $name = 'align';
    	}
 
        $image->setAttribute($name, $value);
    }
 
    $image->removeAttribute('style');
}
 
echo $doc->saveHTML();

y'a sans doute un truc plus sympa a faire au niveau des replacements (float -> align)

J'ai pas encore testé ta solution stealth, mais voici une alternative que je viens de faire, en fait comme le height et width etc ne sont pas forcement dans le meme ordre dans le "style" alors je les sors 1 par 1..
Code:

1 2 3 4 5 6 7 8 9 10 11 $pattern = '#(<img .*) (style=".*)width: ([0-9]+)px;(.*/>)#'; $replace = '$1 width="$3" $2$4'; $content = preg_replace($pattern, $replace, $content); $pattern2 = '#(<img .*) (style=".*)height: ([0-9]+)px;(.*/>)#'; $replace2 = '$1 height="$3" $2$4'; $content = preg_replace($pattern2, $replace2, $content); $pattern3 = '#(<img .*) (style=".*)float: (\w+);(.*/>)#'; $replace3 = '$1 align="$3" $2$4'; $content = preg_replace($pattern3, $replace3, $content);
par contre le width sort pas lol y a toujours un truc qui cloche!!!
ça me fait un truc du genre
Code:

1 2 width="1" height="102" align="right" style=" width: 105px; border- border-style: solid; margin: 11px 1px; " //le width devrait être à 105 ici
Je vais tester ta solution!!!

Voir 40 message(s) de cette discussion en une page