Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Цикл по getElementById (https://javascript.ru/forum/misc/3346-cikl-po-getelementbyid.html)

GogElf 10.04.2009 12:47

Цикл по getElementById
 
Здравствуйте. Я не очень шарю javascript, но хочу изучить :)
У меня тут проблема не понимаю как сделать цикл по всем getElementById объектам...Скриптик конвертирует цену между рублем и долларом.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <title></title>
  <script>
function rub(rub){
	var summ = document.getElementById('cen').innerHTML;
	var valut = document.getElementById('val').innerHTML;
		if (valut != 'руб.'){
			document.getElementById('cen').innerHTML = summ*rub;
			document.getElementById('val').innerHTML = 'руб.';
		}else {
			document.getElementById('cen').innerHTML = summ / rub;
			document.getElementById('val').innerHTML = '$';
		}
}
  </script>
</head>
<div id="cena"><span id="cen">52</span><span id="val">$</span></div>
<div id="cena"><span id="cen">52</span><span id="val">$</span></div>
<div id="cena"><span id="cen">52</span><span id="val">$</span></div>
<div id="cena"><span id="cen">52</span><span id="val">$</span></div>
<input type="button" onclick="java: rub('35.2')" value="GO" />
<body>
</body>
</html>

Gvozd 10.04.2009 13:33

id-шник у элемента должен быть уникальным в пределах документа.
и getElementById потому всегда возвращает один элемент.
используйте другую зацепку для обхода элементов.
например назначьте id ихнему родительскому элементу, и обходите го потомков

GogElf 10.04.2009 14:50

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <title></title>
<script>
function rub(rub){
	var div = document.getElementById('cena');
	var elems = div.getElementsByTagName('td');
	for (var i=0; i<elems.length; i++){
	var summ = elems[i].getElementsByTagName('span').innerHTML;
	var valut = elems[i].getElementsByTagName('i').innerHTML;
		if (valut == '$'){
			elems[i].getElementsByTagName('span').innerHTML = summ*rub;
			elems[i].getElementsByTagName('i').innerHTML = 'руб.';
		}
		else
		{
			elems[i].getElementsByTagName('span').innerHTML = summ / rub;
			elems[i].getElementsByTagName('i').innerHTML = '$';
		}
	}
}
</script>
</head>
<body>
<table border="1">
<div>
<tr id="cena">
<th scope="row" class="spec">1 месяц</th>
<td class="one"><span>4</span><i>$</i></td>
<td class="one"><span>4</span><i>$</i></td>
<td class="one"><span>4</span><i>$</i></td>
<td class="one"><span>4</span><i>$</i></td>
<td class="one"><span>4</span><i>$</i></td>
</tr>
</div>
</table>
<input type="button" onclick="java: rub('35.2')" value="GO" />
</body>
</html>

Не че не происходит... :(

Kolyaj 10.04.2009 14:57

Цитата:

Сообщение от GogElf
elems[i].getElementsByTagName('span').innerHTML

getElementsByTagName возвращает коллекцию.

GogElf 10.04.2009 15:17

Спасибо. Заработало :)

GogElf 10.04.2009 16:15

(для примера потомкам)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <title></title>
<script>
function rub(rub){
	var div = document.getElementById('cena');
	var elems = div.getElementsByTagName('td');
	for (var i=0; i<elems.length; i++){
	var summ = elems[i].getElementsByTagName('span')[0].innerHTML;
	var valut = elems[i].getElementsByTagName('span')[1].innerHTML;
		if (valut == '$'){
			elems[i].getElementsByTagName('span')[0].innerHTML = summ*rub;
			elems[i].getElementsByTagName('span')[1].innerHTML = 'руб.';
		}
		else
		{
			elems[i].getElementsByTagName('span')[0].innerHTML = summ / rub;
			elems[i].getElementsByTagName('span')[1].innerHTML = '$';
		}
	}
}
</script>
</head>
<body>
<table border="1">
<tr id="cena">
<th scope="row" class="spec">1 месяц</th>
<td class="one"><span>4</span><span>$</span></td>
<td class="one"><span>4</span><span>$</span></td>
<td class="one"><span>4</span><span>$</span></td>
<td class="one"><span>4</span><span>$</span></td>
<td class="one"><span>4</span><span>$</span></td>
</tr>
</table>
<input type="button" onclick="java: rub('33.63')" value="GO" />
</body>
</html>

x-yuri 10.04.2009 18:21

а что это за onclick="java: rub('33.63')"
http://javascript.ru/unsorted/why_href_js_is_bad

GogElf 10.04.2009 19:12

x-yuri эм... я не дописал но все равно работало :)


Часовой пояс GMT +3, время: 02:46.