Zmiana divów bez przeładowywania strony (java script)

Question

Witam, potrzebuję zrobić coś podobnego jak tutaj:

http://i.imgur.com/ht3Luu3.png

to jest żeby po kliknięciu w przycisk zmieniała mi się rozpiska nie odświeżając strony. Warto dodać, że oba elementy (ten pierwszy i ten który go zmienia po kliknięciu) będą tej samej wielkości, zmienią się tylko napisy.

Tutaj 'realny' przykład jakby ktos chciał się zapoznać:

http://www.esl-one.com/csgo/katowice-2015/standings/

Dodam, że moje umiejętności javascriptu sprowadzają się do tego, że potrafię co najwyżej rozróżnić kod napisany w tym jezyku od innych (najpierw chciałbym się nauczyć phpa) :) dlatego prosiłbym o dokładny kodzik, z miejscami gdzie podstawię tylko oba divy (od biedy obrazki) i przycisk.

Answer 1

Mam nadzieję, że dobrze cię rozumiem.

HTML:

<div id="div">zawartość</div>
<button onclick="a();"></button>
<button onclick="b();"></button>

Możesz tych buttonów zrobić więcej, zmieniaj po prostu onclick.

JS:

function a()
{
document.getElementById("div").innerHTML="nowa treść pokaże się przy kliknięciu w 1. button";
}
function b()
{
document.getElementById("div").innerHTML="nowa treść pokaże się przy kliknięciu w 2. button";
}

Tych funkcji możesz zrobić więcej, zmieniaj nazwę funkcji(a,b,...) i treść.

Niestety ta metoda ma wady, nie zmienia adresu.

Jeśli chcesz, aby był zmieniany adres strony, musisz zrobić to w php.