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

731
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, которая добавляет новые элементы на страницу, запускались функции из других скриптовСкрипты...

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

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

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

1031