подгрузка на ajax, или изменение кода на стороне клиента

вопрос такого плана... есть картинки

img1 img2 img3

3 дива

<div pop></div>
<div rap></div>
<div popca></div>

и

поле для вывода текста

==========

допустим при нажатии на img1 вызывается текст лалала - это впринципе ничего сложного, но как сменить <div pop></div> на
<div rap></div>? т.е. нужно не подгрузить содержимое, а внести изменение в код...
див должен смениться не перезагрузив страницу...

 

Что-то типа этого:

Code:

<script type="text/javascript">

 $(function() {
            $('#myLink').click(function() {
	    $("#pop").attr({ 
            id: "rap",
	   });
        });
    });

</script>
<a href="#" id="myLink">Click</a>
<div id="pop">sss</div>

 

- ниже уже ближе

а как теперь передать в клике индефикатор.. на что менять, на pop или на popsa

 

<script type="text/javascript">

$(function() {
$('#myLink').click(function() {
$("#1").attr({
id: "2",
});
});
});

</script>
<a href="#" id="myLink">Click1</a>
<a href="#" id="myLink">Click2</a>
<a href="#" id="myLink">Click3</a>
<div id="1">sss</div>
<div id="2">sss</div>
<div id="3">sss</div>

-----------

вот впринципе так... но в этом коде он сменит просто див с 1 на 2
а если я опять нажму на клик1, но назад не меняет...

 

jQuery - копай

 

копал... ничего хорошего не накопал..

 

непонятно про какой ты идентификатор говоришь...
Вот те офф. офигительная документация с примерами по жквери
http://docs.jquery.com/Manipulation/replaceWith#content

 

Code:

$(function() {
            $('#myLink').click(function() {
		    var attribute = $("#pop").attr("id");
			if(attribute == 'pop') {
				//alert(attribute);
				$("#pop").attr({ id: "rap",});
			} else {
				$("#rap").attr({ id: "pop",});
			}
        });
    });

 

вот как надо...
где крестик - это на что нажимает...
цветная область - это и есть div

 

совершенно не то

 

А не проще ли просто при нажатии на кнопку скрывать не нужные дивы?

visible:none

 

не проще... нужно именно менять див

 

PHP:

<img alt="img1" src="./img1" onclick="document.getElementById('out').innerHTML =document.getElementById('pop').innerHTML">
<img alt="img2" src="./img2" onclick="document.getElementById('out').innerHTML =document.getElementById('rap').innerHTML">
<img alt="img3" src="./img3" onclick="document.getElementById('out').innerHTML =document.getElementById('popca').innerHTML">

<div id="pop">123</div>
<div id="rap">456</div>
<div id="popca">789</div>

<div id="out">тут будет содержимое дива</div>

 

Если я тебя правильно понял и нужно изменить параметры/содержимое сужествующего элемента в коде, то используй obj.getAttribute(name) и obj.setAttribute(name, value) для работы с его аттрибутами и obj.innerHtml/obj.outerHtml для его содержимого.

Причем последний полностью перезапишет код, вместе с самим тегом:

Code:

было:

<div id="foo">...</div>
<div id="bar">...</div>
<div id="other">...</div>

выполнили:
document.getElementById('bar').outerHTML = '<span>test</span>';

стало:
<div id="foo">...</div>
<span>test</span>
<div id="other">...</div>

 

Helios, не надо перезаписывать сам тег, нужно сменить только имя дива

imajo.ati, нифига не выходит.... меняет только если див уже выведен в браузер.... подгрузки нет..






вот что надо... при щелчке на первую афишу, картинка в левом верхнем углу - меняется на поп, на середину - на рок, на третью, - попса...

вот как выглядет это в хтмл

 

<div class="entry rnr-entry"> - вот этот фрагмент самый злостный...

 

ну так кто тебе мешает пользоваться setAttribute?

Code:

function setClass(div_id, classname)
{
    document.getElementById(div_id).setAttribute('class', 'entry ' + classname);
}