Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   getElementsByClassName не работает (https://javascript.ru/forum/misc/45918-getelementsbyclassname-ne-rabotaet.html)

Apelcun77 20.03.2014 18:54

getElementsByClassName не работает
 
function lookimg(){
for (i = 1; i <= 25; i++) {
document.getElementsByClassName("bottom").innerHTML = document.getElementsByClassName("bottom").innerHTML + '<input class="pickimg" type="radio" name="img" value="' + i + '">' + '<img src="images/asortiment/'+ i +'.jpg">';
}

<div class="popup-box" id="popup-box-1">
    <div class="close">X</div>
    <div class="top">
        <h2>Выберите картинку:</h2>
    </div>
    <div class="bottom">
    </div>
</div>

Не работает document.getElementsByClassName("bottom") - он не находит класс и не хочет вписывать в него нужную информацию. Что мне сделать чтобы он заработал?

ruslan_mart 20.03.2014 19:09

function lookimg() {
   var elem = document.getElementsByClassName("bottom")[0];
   for (i = 1; i <= 25; i++) {
      elem.innerHTML += '<input class="pickimg" type="radio" name="img" value="' + i + '">' + '<img src="images/asortiment/'+ i +'.jpg">';
   }
}

Apelcun77 20.03.2014 19:25

<html> 
<head> 
  <style type='text/css'>  
  </style> 
  <script type='text/javascript' src='jquery.js'></script> 
  <script type='text/javascript'> 
var elem = document.getElementsByClassName("bottom")[0];

function lookimg(){
for (i = 1; i <= 25; i++) {
   elem.innerHTML += '<input class="pickimg" type="radio" name="img" value="' + i + '">' + '<img src="images/asortiment/'+ i +'.jpg">';
}
  </script> 
</head> 
<body onload="lookimg();"> 
<div class="popup-box" id="popup-box-1">
    <div class="close">X</div>
    <div class="top">
        <h2>Выберите картинку:</h2>
    </div>
    <div class="bottom">
    </div>
</div>
</body> 
</html>

Сделал как вы сказали, все-равно не работает

nice_try 20.03.2014 19:26

закрывающую скобку у функции пропустил

Vlasenko Fedor 20.03.2014 19:29

var elem = document.querySelector('#popup-box-1>div.bottom');

:)

Apelcun77 20.03.2014 20:32

<html> 
<head> 
  <style type='text/css'>  
  </style> 
  <script type='text/javascript' src='jquery.js'></script> 
  <script type='text/javascript'> 
var elem = document.querySelector('#popup-box-1>div.bottom');
function lookimg(){
for (i = 1; i <= 25; i++) {
   elem.innerHTML += '<input class="pickimg" type="radio" name="img" value="' + i + '">' + '<img src="images/asortiment/'+ i +'.jpg">';
}
}
  </script> 
</head> 
<body onload="lookimg();"> 
<div class="popup-box" id="popup-box-1">
    <div class="close">X</div>
    <div class="top">
        <h2>Выберите картинку:</h2>
    </div>
    <div class="bottom">
    </div>
</div>
</body> 
</html>

СДелал так и опять не работает

рони 20.03.2014 20:39

Apelcun77,
поставьте 7 строку в конец строки 8

Apelcun77 20.03.2014 20:58

спасибо, получилось!

danik.js 20.03.2014 23:09

Цитата:

Сообщение от Apelcun77
for (i = 1; i <= 25; i++) {
   elem.innerHTML +=

Чувак, не делай так. При изменении innerHTML всякий раз уничтожаются и пересоздаются элементы!
Делай так:
var html = '';
for (i = 1; i <= 25; i++) {
   html += '...';
}
elem.innerHTML = html;

Vlasenko Fedor 20.03.2014 23:56

Цитата:

Сообщение от danik.js
Чувак, не делай так.

Польза от documentFragment


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