Прогрузка кода по нажатию ссылки

надо сделать так чтоб при нажатии на одну ссылку прогрузался один код, а при нажатии на другую другой. никак не могу понять как это реализовать и поиск по форуму не дал никаких результатов.суть проблемы такова - есть одно место под 2 блока, над этим местом 2 ссылки, когда пользователь нажимает первую ссылку в это место прогружается один код, когда вторую другой. И ещё надо сделать так чтоб при первой загрузке страницы прогружался первый код (какбы по умолчанию). я понимаю что код получится несложный, но всётаки у мя не получилось даже при помощи учебников. 
7 ответов

или хотяб если не сложно подскажите как проверить существует ли переменная? это получается так:if (isset(str)){ str = 1; }(проверка существования переменной, если нет то создать её со значением 1), правильно или я чтото напутал?и как мне по ссылке изменять значение этой переменной? str=2так?если не сложно поправте меня где я ошибки допустил


Что ты подразумеваешь под "кодом"? Обычно подгружается весь JS, всё что не нужно просто не выполняется по условию. Также можно включение JS генерить на сервере, по запросу определять что же тебе нужно.
или хотяб если не сложно подскажите как проверить существует ли переменная?
Похоже нужно сесть за мануал на пару дней, тебе это всегда пригодиться. if(typeof(str) != "undefined), а переменную лучше изменять из функции, вызови её из-ссылки.Чую какой то не хороший костыль, на подобие двух больших листингов document.write? Выкладывай задачу полностью, именно смысл, чего хочешь достичь, а не решение этой, не совсем логичной задачи.


кратко я уже выложил смысл того что должно получится, а если поподробнее то мне надо примерно такое:есть 2 куска кода например первый:
<table border="0" cellpadding="0" cellspacing="0" width="215" style="background:url('http://ххх') no-repeat;"><tr><td height="35" style="color:#FFFFFF;padding-left:20px;padding-top:15px;"><b>Библиотека</b></td></tr> <tr><td style="padding:5px 5px 5px 15px;">тут будет библиотека</td></tr></table>
второй:
<table border="0" cellpadding="0" cellspacing="0" width="215" style="background:url('http://src.ucoz.ru/t/993/5.jpg') no-repeat;"><tr><td height="35" style="color:#FFFFFF;padding-left:20px;padding-top:15px;"><b>остальное</b></td></tr> <tr><td style="padding:5px 5px 5px 15px;">тут будет всё остальное</td></tr></table>
и допустим 2 ссылки 
<a>библиотека</a><a>прочее</a>
надо чтоб при первой загрузке по умолчанию прогружался первый код, если пользователь нажимает 2ю ссылку грузится второй код, если первую то первый. структура чтото типо такого:
<html><body>//если переменная str не существует создать её и присвоить 1//если str = 1 то вывести это:{<table border="0" cellpadding="0" cellspacing="0" width="215" style="background:url('http://ххх') no-repeat;"><tr><td height="35" style="color:#FFFFFF;padding-left:20px;padding-top:15px;"><b>Библиотека</b></td></tr> <tr><td style="padding:5px 5px 5px 15px;">тут будет библиотека</td></tr></table>}//если str = 2 то это:{<table border="0" cellpadding="0" cellspacing="0" width="215" style="background:url('http://ххх') no-repeat;"><tr><td height="35" style="color:#FFFFFF;padding-left:20px;padding-top:15px;"><b>остальное</b></td></tr> <tr><td style="padding:5px 5px 5px 15px;">тут будет всё остальное</td></tr></table>}<a>библиотека</a> //присваиваем str = 1<a>прочее</a> // присваиваем str = 2</body></html>
вот примерно такого типа надо сделать


Зачем оно на JS? Содержимое страницы надо формировать на сервере. По любому на клиенте придётся грузить всё, т.к. до ajax'а тебе чую ещё рано. Самый простой вариант:
<html><body><script type="text/javascript">function show(t) {   var tbs = document.getElementById("tables").childNodes;   for(var i = 0, j = 0; i < tbs.length; i++) {      if(tbs[i].tagName == 'div') {          tbs[i].style.display = j == t? 'block': 'none';          j += 1;      }   }}</script><div id="tables"><div><table border="0" cellpadding="0" cellspacing="0" width="215" style="background:url('http://ххх') no-repeat;"><tr><td height="35" style="color:#FFFFFF;padding-left:20px;padding-top:15px;"><b>Библиотека</b></td></tr> <tr><td style="padding:5px 5px 5px 15px;">тут будет библиотека</td></tr></table></div><div><table border="0" cellpadding="0" cellspacing="0" width="215" style="background:url('http://ххх') no-repeat;"><tr><td height="35" style="color:#FFFFFF;padding-left:20px;padding-top:15px;"><b>остальное</b></td></tr> <tr><td style="padding:5px 5px 5px 15px;">тут будет всё остальное</td></tr></table></div></div><a href="#" onclick="show(0);">библиотека</a><a href="#" onclick="show(1);">прочее</a></body></html>
Посмотри в сторону PHP.


сделал так:
<html><head><script type="text/javascript">function show(t) {  if ((document.getElementById("a1").style.display='')&&     (document.getElementById("a2").style.display=''))  {    document.getElementById("a2").style.display='none';  }  if (t==0)  {    document.getElementById("a1").style.display='';    document.getElementById("a2").style.display='none';  } else  {    document.getElementById("a1").style.display='none';    document.getElementById("a2").style.display='';  }}</script></head><body onLoad="show(2);"><table id="a1" border="0" cellpadding="0" cellspacing="0" width="215" style="background:url('http://ххх') no-repeat;"><tr><td height="35" style="color:#FFFFFF;padding-left:20px;padding-top:15px;"><b>Библиотека</b></td></tr> <tr><td style="padding:5px 5px 5px 15px;">тут будет библиотека</td></tr></table><table id="a2" border="0" cellpadding="0" cellspacing="0" width="215" style="background:url('http://ххх') no-repeat;"><tr><td height="35" style="color:#FFFFFF;padding-left:20px;padding-top:15px;"><b>остальное</b></td></tr> <tr><td style="padding:5px 5px 5px 15px;">тут будет всё остальное</td></tr></table><a href="#" onclick="show(0);">библиотека</a><a href="#" onclick="show(1);">прочее</a></body></html>
тут он не выполняется эта часть кода
  if ((document.getElementById("a1").style.display='')&&     (document.getElementById("a2").style.display=''))  {    document.getElementById("a2").style.display='none';  }
в чём моя ошибка?


попробуйте
if ((document.getElementById("a1").style.display=='')&&     (document.getElementById("a2").style.display==''))


=) спс, такая детская ошибка =D всё работает