Как динамически использовать параметры функций для свойств CSS в JavaScript

Question

Я перевел некоторый код CSS в обычный JavaScript.И сейчас я пытаюсь сделать код функцией для удобства использования, но он не работает.Я знаю, что я неправильно понял, как я могу заставить это работать?

Это код CSS

#container_show_chat {display: none;};
#container_chat {background-image: url('the url');};

В Javascript это переводится как:

var a = document.getElementById("container_show_chat");
a.style.display = "none";
var b = document.getElementById("container_chat");
b.style.backgroundImage = "url('the url')";

Теперь я пытаюсь преобразовать его в такую ​​функциючто всякий раз, когда я вызываю функцию, мне просто нужно добавить свойство для отображения и URL-адрес для фонового изображения в вызове функции.Например:

function Practice(display, image) {
var a = document.getElementById("container_show_chat");
a.style.display;
var b = document.getElementById("container_chat");
b.style.backgroundImage;
};
Practice("none", "the url");

Как я могу это сделать?

Answer 1

Здесь у вас есть более многократно используемая функция.Надеюсь, это поможет:

    <div id="container_show_chat">Hello world</div>

    <script>

        function setStyleInNode(nodeSelector, styleType, value) {
            var node = document.querySelector(nodeSelector);
            node.style[styleType] = value;
        };

        setStyleInNode("#container_show_chat", 'background', 'red');

    </script>

Answer 2

Вы должны назначить параметры и элементам.Нравится

function Practice(display, image) {
  var a = document.getElementById("container_show_chat");
  a.style.display = display;
  var b = document.getElementById("container_chat");
  b.style.backgroundImage = image;
};

Practice("none", "the url");