automatyczna modyfikacja kodu html, chyba nie skomplikowane

0

Cześć,

liczę na pomoc, w temacie odległym mi o 100 tysięcy kilometrów.

potrzebuje skrypt w JS który zrobi coś takiego :

 
<div id="box">
<img src="obraz1">
<img src="folder/obraz2">
</div>

to jest kod który mam na stronie, chciałbym aby po załadowaniu strony zawartość tego div id=box zmieniła się na taką :

 
<div id="box">
<a href="obraz1" data-lightbox="losowy_ciag_rand()"><img src="obraz1"></a>
<a href="folder/obraz2" data-lightbox="losowy_ciag_rand()"><img src="folder/obraz2"></a>
</div>

przyznam się, że mógłbym szukać dalej, ale po prostu nie wiem jak to zrobić, choć bardzo bym chciał.

z góry po raz kolejny dziękuję za pomoc
pozdrawiam
Kamil

0

Podstawy podstaw:

 document.getElementById("box").innerHTML = "twoja_zawartosc"; 

... i pod [twoja zawartośc] wklejasz content tego diva czyli te linki czy co tam chcesz.

0

ok, to rozumiem, ale co zrobic w przypadku gdy nie przechowuje danych z diva nigdzie, laduje mi sie strona a te obrazki po prostu juz sa, jak - choćby bardzo ogólnie- powinna wyglądać funkcja w JS która dla każdego elementu IMG wykona operację :

1. x = ścieżka pliku obrazka (atrybut src)
2. przed obrazkiem wstaw <a href=x >
3. za obrazkiem wstaw </a>

wyjasniam o co chodzi : user przy uzyciu edytora wysiwyg edytuje zawartosc boxa, ten box jest pobierany z bazy danych w formie kodu html ktory jest wstawiany do


nie wiem czy tam będzie jeden obrazek, czy cztery obrazki, treść się będzie zmieniać, a wiadomo, że user nie będzie tworzył kodu <a href...., ja też nie chcę rozbijać tego w php, wiec chciałbym zrobić to w JS w ten sposób, że strona po załadowaniu jest modyfikowana przez skrypt w JS dodając w ten sposób obsługę galerii lightbox.</p>
0

w końcu mam coś co częściowo rozwiązało mój problem :

 $(document).ready(function(){
$("#box_control img").each(function(){ 
var random_number = Math.floor((Math.random()*1000)+1);
$(this).wrap('<a class="photo" data-lightbox='+ random_number+'/>'); });
 });

tylko jak jeszcze pobrać do zmiennej atrybut src aktualnie "obrabianego" img ?

Kamil :)

0

wklejam, może komuś się przyda :) pewnie można to napisać 3 razy krócej i 4 razy lepiej, ale działa :)

 $(document).ready(function(){
$("#box_control img").each(function(){ 
var random_number = Math.floor((Math.random()*100)+1);
var sciezka = $(this).attr("src");
$(this).wrap('<a href="'+sciezka+'" class="my" data-lightbox='+ random_number+'/>'); });
 });

Pozdrawiam i dziękuje ;)

Kamil

1 użytkowników online, w tym zalogowanych: 0, gości: 1