2013-08-19 23 views
5

Bu yüzden oldukça uzun bir süredir var ve en iyi ben görüntü etiketi sonra bir bağlantı ve bir span ile görüntü kaydırma:PHP dom link görüntü görüntü ve görüntü etiketi önce yayılma

<a href=""> 
    <img src=""> 
    <span></span> 
</a> 

Ama istediğim wat: Ben arkadaşları varyasyonların hiç türlerini ve

$img->parentNode->appendChild($dom->createElement('span'), $img); 

konumlarını ve insertBefor kullanımını çalıştı

<a href=""> 
    <span></span> 
    <img src=""> 
</a> 

e() kodumdaki her türlü yer ve tamamen php DOM şeyler için yeni olduğum için tamamen fikir dışındayım. Kaynağım:

foreach($dom->getElementsByTagName('img') as $img) 
{ 
$fancyHref = $dom->createElement('a'); 

         $clone = $fancyHref->cloneNode(); 
         $img->parentNode->replaceChild($clone, $img); 
         $clone->appendChild($img); 
         $img->parentNode->appendChild($dom->createElement('span')); 
}; 

Güncelleme: amacıma netleştirmek için: Ben html img etiketi var.

<img src="" /> 

<a href=""> 
    <span class=""></span> 
    <img src="" /> 
</a> 

sonra önce: o php dom geçer sonra görüntü etiketinden önce bir aralık etiketinin ile bir etiketin sarılmış img etiketini istiyorum Bunu yapmak için şu anda kodum (açıklık olmadan)

foreach($dom->getElementsByTagName('img') as $img) 
      {    
       $src = $img->getAttribute('src'); 
       $filename = substr(strrchr($src , '/') ,1); 
       $filename = preg_replace('/^[.]*/', '', $filename); 
       $filename = explode('.', $filename); 
       $filename = $filename[0]; 

       if($this->imagesTitles[$this->currentLanguage][$filename] !== '') 
       { 
        $img->setAttribute('title', $this->imagesTitles[$this->currentLanguage][$filename]); 
        $img->setAttribute('alt', $this->imagesTitles[$this->currentLanguage][$filename]); 
       } 
       else 
       { 
        $img->removeAttribute('title'); 
        $img->removeAttribute('alt'); 
       } 

       $classes = explode(' ', $img->getAttribute('class')); 
       if(!in_array('no-enlarge', $classes)) 
       { 
        $fancyHref = $dom->createElement('a'); 
        $span = $dom->createElement('span'); 
        $span->setAttribute('class', 'magnifier'); 
        $fancyHref->setAttribute('class', 'enlarge'); 
        $fancyHref->setAttribute('rel', 'enlarge'); 
        $fancyHref->setAttribute('href', $img->getAttribute('src')); 
        if($img->getAttribute('title') !== '') 
        { 
         $fancyHref->setAttribute('title', $img->getAttribute('title')); 
         $fancyHref->setAttribute('alt', $img->getAttribute('title')); 
        } 
        $clone = $fancyHref->cloneNode(); 

        $img->parentNode->replaceChild($clone, $img); 
        $clone->appendChild($img); 
        $img->parentNode->insertBefore($span, $img);       
       } 

       $img->setAttribute('class', trim(str_replace('no-enlarge', '', $img->getAttribute('class')))); 

       if($img->getAttribute('class') === '') 
       { 
        $img->removeAttribute('class'); 
       } 
      } 
+0

Bu işlevler parentNode '... 'dan nerededir? –

+0

İşleri düz bir şekilde almak için zaten bir resminiz var ve daha önce yayılma süresi mi var? – Itay

+0

Yeas. HTML'de bir resim etiketim var. Yapmak istediğim, etrafına bir şey sarmak ve daha önce bir sınıfa bir başlık etiketi koymak. Ne istediğimi açıklamak için soruyu güncelledim. –

cevap

1

DOMNode->insertBefore() yöntemini (docs) kullanabilirsiniz. Bu, $parentNode->insertBefore($nodeToBeInserted, $nodeToInsertBefore) formuna sahiptir. Kodunuz olacaktır:

$img->parentNode->insertBefore($dom->createElement('span'), $img); 

DOMNode->appendChild() (docs) sadece 1 argüman (takılı düğüm) vardır ve bu düğüm her zaman son childNode öğesine sonra eklenecektir.

Düzenleme:

Şimdi kodumu test ettik, ve test durumda benim hattı ile $img->parentNode->appendChild($dom->createElement('span')); yerini alacak eğer, doğru formatı ile sona ereceğini. Ancak öğeleri çok kafa karıştırıcı bir şekilde işliyorsunuz. Bunun yanı sıra, güncellenmiş kodunuzu test edersem, ya istediğiniz formatla ya da bir span elemanı olmadan ...

Değiştirmek istediğiniz eleman görüntüdür, çünkü bu tek elemandır. aslında belgede. Bu nedenle, klonlama yapmalısınız. Geçerli kodunuz hiyerarşi hatasını ortadan kaldırırken, yalnızca çakışan öğenin yerine tüm değiştirilen kodu kopyalıyorsunuz ve bu da bellek ve zaman kaybı. Çakışan elemanı kopyaladığınızda, bu kolaydır. Öğeleri, görünmelerini istediğiniz sıraya göre eklersiniz. Resmi eklediğinizde, bunun yerine klonu ekleyin. $img'u değiştirmeyin. Resmi manipüle etmeniz gerekiyorsa, bunun yerine klonu manipüle etmeniz gerekir. Daha sonra, değiştirdiğiniz öğelerle ($fancyHref sizin durumunuzda) $img'u değiştirin.

$html = '<img src="">'; 
$dom = new DOMDocument(); 
$dom->loadHTML($html); 

foreach($dom->getElementsByTagName('img') as $img) { 
    $fancyHref = $dom->createElement('a'); 
    $clone = $img->cloneNode(); 
    $span = $dom->createElement('span'); 
    #... do whatever you need to do to this span, the clone and the a element ... 

    #... when you are done, you can simply append all elements you have been manipulating ... 
    $fancyHref->appendChild($span); 
    $fancyHref->appendChild($clone); 

    $img->parentNode->replaceChild($fancyHref, $img); 
}; 

echo $dom->saveHTML(); 
+0

Bunu denedim ve elde ettiğim en iyi sonuç, görüntünün span etiketinin içine yerleştirilmesidir. –

+0

Hangi doctype var? – Sumurai8

+0

0

Ummm. Bunun bir cevap olarak sınıflandırılamayacağını biliyorum, ancak zaten buna sahip değil misiniz? Demek istediğim ..kaynak veri olarak bu (data.html) ile

$dom = new DOMDocument; 
$dom->loadHTMLFile("data.html"); 

foreach($dom->getElementsByTagName('img') as $img){ 
    $src = $img->getAttribute('src'); 

    $filename = substr(strrchr($src , '/') ,1); 
    $filename = preg_replace('/^[.]*/', '', $filename); 
    $filename = explode('.', $filename); 
    $filename = $filename[0]; 

    $classes = explode(' ', $img->getAttribute('class')); 

    if(!in_array('no-enlarge', $classes)) 
    { 
     $fancyHref = $dom->createElement('a'); 
     $span = $dom->createElement('span'); 
     $span->setAttribute('class', 'magnifier'); 
     $fancyHref->setAttribute('class', 'enlarge'); 
     $fancyHref->setAttribute('rel', 'enlarge'); 
     $fancyHref->setAttribute('href', $img->getAttribute('src')); 
     if($img->getAttribute('title') !== '') 
     { 
      $fancyHref->setAttribute('title', $img->getAttribute('title')); 
      $fancyHref->setAttribute('alt', $img->getAttribute('title')); 
     } 
     $clone = $fancyHref->cloneNode(); 

     $img->parentNode->replaceChild($clone, $img); 
     $clone->appendChild($img); 
     $img->parentNode->insertBefore($span, $img); 
    } 

    $img->setAttribute('class', trim(str_replace('no-enlarge', '', $img->getAttribute('class')))); 

    if($img->getAttribute('class') === ''){ 
     $img->removeAttribute('class'); 
    } 
} 

echo "<pre>" . htmlentities($dom->saveHTML()) . "</pre>"; 

: Ben kodunuzu çalıştı

<!doctype html> 
<html> 
    <head> 
    </head> 
    <body> 
     <img src="http://lorempixel.com/g/400/200/" alt="alts" title="tits"> 
    </body> 
</html> 

Ve sonuç şudur: '.. Isn

<!DOCTYPE html> 
<html> 
    <head> 
    </head> 
    <body> 
     <a class="enlarge" rel="enlarge" href="http://lorempixel.com/g/400/200/" title="tits" alt="tits"> 
      <span class="magnifier"> 
      </span> 
      <img src="http://lorempixel.com/g/400/200/" alt="alts" title="tits"></a> 
    </body> 
</html> 

Yani İstediğin şey bu mu? : D

İlgili konular