JavaScript Framework CSS

I am creating a javascript framework just to see how its done. I have come to css, at the moment it consists of loads of if statements e.g.

function (propertyName, value) {
    if (propertyName == "background") { = value;
    else if (propertyName == "border") { = value;

and so on.

There must be a better way. HELP!

This is where you find out about dot notation and bracket notation, which is a neat feature of JavaScript.

These things are effectively the same: = value;
element['style'].background = value;
element['style']['background'] = value;

So you can just do this:

function (propertyName, value) {[propertyName] = value;

You have to make sure people are using the right propertyName. For example in CSS it’s “line-height” and in JavaScript’s style object it’s lineHeight. It gets worse because it’s styleFloat in IE but cssFloat in non-IE browsers. So make sure what’s getting given to the function has the right syntax!

That’s great thanks, and now I’ve learnt some more javascript