Показать сообщение отдельно
  #18 (permalink)  
Старый 07.02.2017, 09:26
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,127

Роман Андреевич, порядок ключей в обьекте не гарантируется браузерами, поэтому надёжнее массив
[{value: 150},{value: 100}, .....]

<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
 ul{
   width: 20%;
 }

  li{
    height: 7px;
    margin: 7px;
    background-color: #0000FF;
  }

  </style>

  <script>
window.addEventListener('DOMContentLoaded', function() {
/*объект значений ширины*/
var wid = {
one: {
value: 150
},
two: {
value: 100
},
three: {
value:50
},
four: {
value:400
}
}
/* список элементов*/
var elems = document.querySelectorAll('ul li');
Object.keys(wid).forEach(function(el,i) {
       elems[i].style.width = wid[el].value+'%';
});
/*Далее необходимо задать всем li из списка ширину - значения в объекте wid*/

    });
  </script>
</head>

<body>
<ul>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>


</body>
</html>
Ответить с цитированием