Цикл по 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>
|
id-шник у элемента должен быть уникальным в пределах документа.
и getElementById потому всегда возвращает один элемент. используйте другую зацепку для обхода элементов. например назначьте id ихнему родительскому элементу, и обходите го потомков |
<!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>
Не че не происходит... :( |
Цитата:
|
Спасибо. Заработало :)
|
(для примера потомкам)
<!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>
|
а что это за onclick="java: rub('33.63')"
http://javascript.ru/unsorted/why_href_js_is_bad |
x-yuri эм... я не дописал но все равно работало :)
|
| Часовой пояс GMT +3, время: 14:15. |