preg_replace - превратить <img> в <a href....><img</a>

Я изо всех сил, чтобы превратить тег изображения в ссылку и копировать параметры в теге т.е.preg_replace - превратить <img> в <a href....><img</a>

<img src="/images/image1.jpg" alt="The name of image">

<a href="/images/image1.jpg" target="_self" rel="zoom" title="The name of image"><img src="/images/image1.jpg" alt="The name of image"></a>

Моя проблема заключается не только дублируя src и alt, но учитываются недостающие и дополнительные теги, то есть

<img src="/images/image1.jpg" >

<a href="/images/image1.jpg" target="_self" rel="zoom" title=""><img src="/images/image1.jpg" ></a>

<img style="padding:5px;" src="/images/image1.jpg" alt="The name of the image">

<a href="/images/image1.jpg" target="_self" rel="zoom" title="The name of the image"><img style="padding:5px;" src="/images/image1.jpg" alt="The name of the image"></a>

Это должно быть сделано для всех экземпляров тега IMG всей строки.

Не смысл звучать как вызов, но может ли кто-нибудь предложить возможное решение, я уверен, что это можно сделать с помощью preg_replace, но я просто не могу это обработать?

Спасибо

источник

2013-09-06 user2751834

Возможный дубликат [Как вы анализируете и обрабатываете HTML/XML в PHP?] (Http://stackoverflow.com/questions/3577641/how-do-you-parse-and-process-html-xml-in -php) – Quentin

Можете ли вы объяснить больше? – Yotam

Здравствуйте, Yotam, просто поставьте у меня систему CMS, где клиент может загружать изображения, а код создает img-теги. Мне нужно разобрать код, созданный с помощью CMS, чтобы каждое изображение было доступно для лайтбокса.Поэтому мне нужно инкапсулировать каждый тег img в тег 'a href', дублирующий некоторые из параметров тега img, - и hey preo, clickable lightboxed images. Однако без использования preg_match, который, я считаю, будет самым чистым методом, мое кодирование будет ужасающим! – user2751834

Самый простой способ сделать это: HTML:

<span id="My_ID"><img class="My_img" src="/images/image1.jpg" alt="The name of image" /></span>

JavaScript и JQuery (не обязательно, но я использовал его для совместимости браузера):

var first= true; 
$('.My_img').hover(function(){  
    if(first == true){ 
    //First time this prevent Dulicated runing and shows errors 
     first = false;//it is not thew first time anymore 
var alt = $('.My_img').attr('alt');//Get the img alt 
    var src = $('.My_img').attr('src');//Get the img src 
    document.getElementById('My_ID').innerHTML = '<a href="' + src + '" target="_self" rel="zoom" title="' + alt + '" ><img src="' + src +'" alt="' + alt + '" width="200" height="100"></a>'; 
    } 
});

Для демонстрацией выше нее является скрипка:

http://jsfiddle.net/Mh9Np/

Просто, но innerHTML это плохая практика, как все говорят, так что я дам вам представление о другом пути: (Samse HTML)

1-Хранить IMG в переменной

2-магазин атрибут alt и src в переменных.

2-Создать элемент.

3-Установите для него атрибуты, которые вы хотите с помощью переменных alt и src.

4-Добавить графическое изображение.

5-Добавить в пролет.

6-Удалить оригинал img.//Optional, это может помочь решить некоторые проблемы с дизайном.

источник

2013-09-06 09:25:58

preg_replace - превратить <img> в <a href....><img</a>

ответ

Смежные вопросы