Elements css() - KirkGarcia182/domExtend GitHub Wiki
Sets a single or multiple styles to an element
// set a single style to an element
element.css(styleName, styleValue);
// set multiple styles to an element
element.css({
styleName1: styleValue1,
styleName2: styleValue2,
styleName3: styleValue3
});
The element you just manipulated so you can chain these methods.
<!DOCTYPE html>
<html>
<head>
<title>domExt Examples</title>
</head>
<body>
<div id="app">
<div class="menus">
<ul id='menuList'>
<li><a class='menuLink'>Menu 1</a></li>
<li><a class='menuLink'>Menu 2</a></li>
<li><a class='menuLink'>Menu 3</a></li>
</ul>
</div>
</div>
<script type="text/javascript" src="domExt.js"></script>
<script type="text/javascript">
window.$ = document;
let app = $.byId('app');
// set a single style to an element
app.css('color','lime');
console.log(app);
/* Result
<div id="app" style='color: lime'>
*/
// set multiple styles to an element
app.css({
backgroundColor: 'pink',
fontSize: '21px',
fontWeight: 'bold',
width: '100px',
height: '150px'
});
console.log(app);
/* Result
<div id="app" style='color: lime; background-color: pink, font-size: 21px, font-weight: bold, width: 100px, height: 150px'>
*/
</script>
</body>
</html>