Home  >  Article  >  Web Front-end  >  Javascript changes CSS styles (local and global)_javascript tips

Javascript changes CSS styles (local and global)_javascript tips

WBOY
WBOYOriginal
2016-05-16 17:08:221162browse
1. Partially change the style

There are three methods: directly change the style, change the className and change the cssText

Change the className: document.getElementById('obj').className= "…"

Change cssText: document.getElementById('obj').style.cssText="width:20px; border:solid 1px #f00;";

Change direct style: document .getElementById('obj').style.backgroundColor="#003366″

2. Globally change the style

Achieved by changing the href value of the external link style Real-time switching of web page styles, that is, "changing template styles".

First you need to give an id to the target that needs to be changed, such as
Copy the code The code is as follows:



The call is very simple, such as
Copy code The code is as follows:

Click me to change the style
Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn