how to use css in javascript code example
Example 1: javascript modify css
var el = document.getElementById("elementID");
el.style.css-property = "cssattribute";
el.style.backgroundColor = "blue";
$("#elementID").css("css-property", "css-attribute");
$("#elementID").css("background-color", "blue");
$("#elementID").css({"css-property": "css-attribute", "css-property": "css-attribute"});
$("#elementID").css({
"css-property": "css-attribute",
"css-property": "css-attribute"});
Example 2: how to give css style in javascript
document.getElementById("myH1").style.color = "red";
Example 3: add css in javascript
document.getElementById("demo").style.display = "none";
Example 4: html css javascript
<!-- Answer to: "html css javascript" -->
<!--
To keep things simple:
HTML provides the basic structure of sites, which is enhanced and
modified by other technologies like CSS and JavaScript. CSS
is used to control presentation, formatting, and layout.
JavaScript is used to control the behavior of different elements.
-->
For example:
<!--HTML-->
<div id="me">Click me!</div>
<!--CSS-->
<style>
div {
height: 128px;
width: 128px;
background: red;
}
</style>
<!--JS-->
<script>
document.getElementById("me".addEventListener("click", function(){
document.getElementById("me").style.background = 'blue';
});
</script>
<!-- If you want to test the code above, go to:https://www.w3schools.com/code/tryit.asp?filename=GDZ0PJDLYQ1V -->
<!--
For more information, go to:
https://blog.hubspot.com/marketing/web-design-html-css-javascript
-->
Example 5: add css style sheet with javascript
<head>
<script>
function myFunction() {
var x = document.createElement("LINK");
x.setAttribute("rel", "stylesheet");
x.setAttribute("type", "text/css");
x.setAttribute("href", "styles.css");
document.head.appendChild(x);
}
myFunction()
</script>
</head>
Example 6: html css js
<!DOCTYPE html>
<html lang="pt-br" xml:lang="fr" xmlns="http://www.w3.org/1999/xhtml">
<head>
<link rel="stylesheet" type="text/css" href="style.css">
<title>...</title>
</head>
<body>
...
<script type="text/javascript" src="script.js"></script>
</body>
</html>