如何从JavaScript函数获取参数作为文本

Question

<div id="demo" onclick="applycss(250,500,"red")"></div>
<script>
    function applycss(){
        var box = document.getElementById("this.id").style;
        box.height = fisrt parameter;
        box.width = second parameter;
        box.backgroundColor = third parameter;
    }
</script>

How to do this? I want to apply value 250, 500, red to div on click so that I can use this function to any element without long coding.

Answer 1

try this

<script>
     function applycss(fisrt,second,third){
        var box = document.getElementById("demo").style;
          box.height=fisrt;
          box.width=  second;
          box.backgroundColor= third;
}
 </script>

Answer 2

You have some syntax error, see updated code. For multiple CSS properties, you need to create css-string of your parameter values and set it as following:

HTML:

<div id="demo" onclick="applycss(this, '250', '500', 'red');">Div to apply CSS</div>

JS:

function applycss(obj, height, width, bgColor){
    var cssStyle = "height: " + height + "px; ";
    cssStyle += "width: " + width + "px; ";
    cssStyle += "background-color: " + bgColor + ";";

    if(typeof(obj.style.cssText) != 'undefined')
        obj.style.cssText = cssStyle;
    else
        obj.setAttribute('style', cssStyle);
}

DEMO