Felino
@Felino

Передача параметров в css из Json?

Добрый день!
Подскажите пожалуйста, считываю с JSON параметры ширина, высота.
Как мне эти параметры передать в CSS?

пример:

{
  "global": [
    {
      "id": "1",
      "width": "50",
      "height": "150"
    },
    {
      "id": "2",
      "width": "150",
      "height": "350"
    },
    {
      "id": "3",
      "width": "750",
      "height": "850"
    }
  ]
}


Как занести то, что я считал в CSS

.Layer + id{
    width:   px; /* Ширина блока вставить из того что я считал */   
    height:   px; /* Высота блока вставить из того что я считал*/   
   }

либо в html, вместо пробелов то, что я считал с файла
<button style="height: px;width: px"></button>
  • Вопрос задан
  • 360 просмотров
Пригласить эксперта
Ответы на вопрос 2
fallus
@fallus
const all = {
  "global": [
    {
      "id": "1",
      "width": "50",
      "height": "150"
    },
    {
      "id": "2",
      "width": "150",
      "height": "350"
    },
    {
      "id": "3",
      "width": "750",
      "height": "850"
    }
  ]
};

for(item of all.global){
    let elm = document.querySelector('.layer' + item.id);
    elm.style.width = item.width + 'px';
    elm.style.height = item.height + 'px';
}
Ответ написан
Комментировать
@iddqda
network engineer, netdevops
первым способом не уверен, что возможно,
а динамически как то так бы попробовал:

jstr.global.forEach((a) => 
   document.querySelectorAll(".Layer + a.id").forEach((el) => 
        { el.style.width  = a.width; el.style.height = a.height }))
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы