Javascript. Как передать аргументом в функцию css selector?

694
04 января 2017, 04:18
function changeCss(node, selector, property){
   node.style.ВОТ СЮДА = property;
}
Answer 1

Напишем функцию changeCss, которая принимает селектор selector, свойство CSS property и значение для этого свойства value:

function changeCss(selector, property, value) {
    var nodes = document.querySelectorAll(selector);
    for (i = 0; i < nodes.length; ++i) {
        nodes[i].style[property] = value;
    }
}

Примеры вызовов

function changeCss(selector, property, value) { 
    var nodes = document.querySelectorAll(selector); 
 
    for (i = 0; i < nodes.length; ++i) { 
        nodes[i].style[property] = value; 
    } 
} 
 
changeCss("#img", "width", "200px"); 
changeCss("#img", "height", "200px"); 
changeCss("#img", "background-image", "url(http://lorempixel.com/output/nature-q-c-200-200-6.jpg)"); 
changeCss(".text", "margin", "10px"); 
changeCss(".text", "color", "red"); 
changeCss(".text", "font-size", "50px");
<div id="img"> 
</div> 
 
<div class="text"> 
  This is text 
</div>

Answer 2

Используйте функцию eval, которая превращает строку в код:

function changeCss(node, selector, property) {
   eval(node+'.style.'+selector+' = "'+property+'"');
};

function changeCss(node, selector, property) { 
   eval(node+'.style.'+selector+' = "'+property+'"'); 
}; 
$(function() { 
  changeCss('document.getElementById("text")', 'color', 'red'); 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="text">Текст</div>

READ ALSO
Как сделать, что бы при каждом ajax все функции запускались заново

Как сделать, что бы при каждом ajax все функции запускались заново

Как сделать, чтобы при срабатывание функции ajax, которая добавляет новые элементы на страницу, запускались функции из других скриптовСкрипты...

738
jQuery DataTables - добавить строку в таблицу

jQuery DataTables - добавить строку в таблицу

Дано: MySQL, Java - сервлеты, jQuery DataTables

1003