лекции по DOM и что пишут люди на форумах. Но проблема не решается.
Вот есть код:
`var elemAT = document.getElementsByClassName('forAllTime');
// var elemAT = document.getElementById('fat');
var arrAT = [conAT, foodAT, passAT, cigaAT, clotheAT, gaieAT, unnecAT, hobAT, angAT, housAT, careAT, giftsAT, mothAT, petsAT, acceAT, inveAT, eduAT];
var sumAT = 0;
for(var i = 0; i < arrAT.length; i++){
sumAT += arrAT[i];
}
console.log(sumAT.toFixed(2));
var oneProcAT = sumAT / 100;
var procConAT = conAT / oneProcAT;
// elemAT[0].style = "height:" + procConAT + "%";
// elemAT[0].setAttribute("style", "height: 50%");
// elemAT.style.cssText = "height:" + procConAT + "%";;
elemAT.style.height = procConAT + "%";
// document.getElementsByClassName('forAllTime').style.height = procConAT + "%";
// elemAT.style.background = 'red';
// document.getElementsByClassName('forAllTime').style = "height:" + 50 + "%";
console.log(elemAT);
// console.log(document.getElementsByClassName('forAllTime'));
// var getCS = window.getComputedStyle(elemAT);
// console.log(getCS);
console.log(procConAT.toFixed(1));`
`.forAllTime{
display: flex;
align-self: flex-end;
width: 100%;
height: 100%;
background-color: blue;
}`
`<div class="linearDiagram">
<div class="forAllTime"></div>
<div class="forAllTime"></div>
<div class="forAllTime"></div>
<div class="forAllTime"></div>
<div class="forAllTime"></div>
<div class="forAllTime"></div>
<div class="forAllTime"></div>
<div class="forAllTime"></div>
<div class="forAllTime"></div>
<div class="forAllTime"></div>
<div class="forAllTime"></div>
<div class="forAllTime"></div>
<div class="forAllTime"></div>
<div class="forAllTime"></div>
<div class="forAllTime"></div>
<div class="forAllTime"></div>
<div class="forAllTime"></div>
</div>`
Но он указывает что неизвестный параметр Height, хотя такой параметр в стилях есть, он видит этот класс стилей и так далее. Куда копать?
у тебя в массиве arrAt в элементах указана высота, которая должна присваиваться каждому элементу .forAllTime ???
Я как раз хочу применить эти значения, после некоторых арифметических операций с ними в значения высоты div.
т.е. тебе нужно такое же кол-во дивов как элементов в массиве и при этом высота каждого должна подставляться из массива???
Ну типа. Но в данном случае, я хочу чтобы хотя бы изменилась высота всех div. А потом я уже буду добавлять итерацию elemAT[0] и так далее, для изменения опеределенного div. Но кстати, если добавляю индекс элемента, то он не видит style.
Uncaught TypeError: Cannot set properties of undefined (setting 'height') Типа такого.
Да мне бы сейчас сделать, чтобы просто я мог влиять на высоту div. Так как сейчас даже это не получается. Хотя смотрю лекцию, смотрю как люди делают. У меня так же, только выдаёт ошибку. И я не понимаю почему.
дело в том что высота это числовое значение , а ты пытаешься передать непонятно что, какие-то сокращения
Эти сокращения, это переменные с числами.
К примеру, сейчас прописал вот такую строку: elemAT.style.height = "50px"; Всё равно выбивает ошибку "Uncaught TypeError: Cannot set properties of undefined (setting 'height')". При условии, что я вывожу в консоль HTML коллекцию, он видит этот класс. типа всё ок, я не ошибся в написании, но дальше ничего не происходит.
elemAt у тебя коллекция а высоту даешь одному элементу
Я высоту пытаюсь дать всему классу. Если пытаюсь дать высоту первому элементу коллекции, то он ругается уже на style.
щас погоди накидаю пример
Я ради интереса закомментировал другие div, оставил один. Всё равно выбивает ошибку.
Лол. Отмена. Я короче супер-тупой. Я пытался получить элемент DOM, перед тем как он появился.
https://codepen.io/yarovik/pen/xxMgdpX
Я короче решил через ID пойти, и мне теперь приходится кучу переменных с получением id делать, потому что он не хочет через индексацию менять высоту для определенного столбца, а через класс он вообще отказывается работать. Сейчас решил сделать так, чтобы не дизморалить себя, а завтра уже буду смотреть твой вариант или другие, чтобы выглядело нормально. А не кучу однотипных строк.
сразу предостерегу) с id не вариант получать коллекцию элементов - потому как id уникальный идентификатор и не должен дублироваться на одной странице удачи)))
Да. Спасибо. Завтра буду переделывать через ClassName или QuerrySelector.
Олег, Вячеслав поднял тебе репутацию! Теперь она 63
Но странно, что через ClassName, при индексации элементов, начинает ругаться на style.
я тебе там второй вариант накинул на случай если кол-во элементов прописано в верстке
Спасибо. Будем изучать.
Олег, Вячеслав поднял тебе репутацию! Теперь она 64
Привет. Короче, по воспоминаниям твоего кода, сделал аналог. Вышло так. Я доволен. var elemY = document.getElementsByClassName('year'); var arrY = [connY, foodY, passY, cigaY, clotY, gaieY, unneY, hobbY, angeY, housY, careY, giftY, mothY, petsY, acceY, inveY, educY]; var sumY = 0; for(var i = 0; i < arrY.length; i++){ sumY += arrY[i]; } var oneProcY = sumY / 100; for(var i = 0; i < arrY.length; i++){ var procY = arrY[i] / oneProcY; elemY[i].style.height = procY + "%"; }
Обсуждают сегодня