Access the css text from cssText in JavaScript
Description
The following code shows how to access the css text from cssText.
Example
<!-- w w w . j av a 2 s . co m-->
<!DOCTYPE HTML>
<html>
<body>
<p id="block1" style="color: white; background-color: gray">
This is a test.
</p>
<button id="pressme">Press Me</button>
<div id="placeholder"></div>
<script>
var placeholder = document.getElementById("placeholder");
var targetElem = document.getElementById("block1");
displayStyle();
document.getElementById("pressme").onclick = function() {
targetElem.style.cssText = "color:black";
displayStyle();
}
function displayStyle() {
if (placeholder.hasChildNodes()) {
placeholder.removeChild(placeholder.firstChild);
}
var newElem = document.createElement("pre");
newElem.innerHTML += targetElem.style.cssText;
placeholder.appendChild(newElem);
}
</script>
</body>
</html>
The code above generates the following result.
Javascript Tutorial Style
Change class for a HTML element with toggle...
Check if the Style Property is marked as im...
Disable CSS Style in Javascript in JavaScri...
Explore CSS Properties Programmatically in ...
Get Basic Information About Stylesheets in ...
Get Computed Style in JavaScript
Get css text for an element in JavaScript
Get one style item in JavaScript
Get style value by property value in JavaSc...
Get the Computed Styles in JavaScript
Get the Fine-Grained CSS DOM Objects in Jav...
Remove a style value by property name in Ja...
Retrieve classes by index, using array-styl...
Set css property in Javascript in JavaScrip...
Set new class name to change style for a pa...
Set style by property name in JavaScript
Show and hide element in JavaScript
Switch style with mouse over and mouse out ...
Use CSSRuleList.item to access each item in...
Use CSSRuleList to find out each rule in Ja...
Use Media Constraints in JavaScript
Access the css text from cssText in JavaScr...
Change class for a HTML element by adding n...Change class for a HTML element with toggle...
Check if the Style Property is marked as im...
Disable CSS Style in Javascript in JavaScri...
Explore CSS Properties Programmatically in ...
Get Basic Information About Stylesheets in ...
Get Computed Style in JavaScript
Get css text for an element in JavaScript
Get one style item in JavaScript
Get style value by property value in JavaSc...
Get the Computed Styles in JavaScript
Get the Fine-Grained CSS DOM Objects in Jav...
Remove a style value by property name in Ja...
Retrieve classes by index, using array-styl...
Set css property in Javascript in JavaScrip...
Set new class name to change style for a pa...
Set style by property name in JavaScript
Show and hide element in JavaScript
Switch style with mouse over and mouse out ...
Use CSSRuleList.item to access each item in...
Use CSSRuleList to find out each rule in Ja...
Use Media Constraints in JavaScript