How to write JS and CSS in the same file_javascript skills-JS Tutorial-php.cn

We often merge multiple CSS or multiple JS into one to save requests, but this still requires at least two. I saw on the MSDN Blog that it is possible to combine JS and CSS in one file. How to do it? Using comments, take a look at the code first. window.onload=function(){ document.getElementById("test2").innerHTML="Legendary JS tester. If you see me, then JS also takes effect"; } <!-- #test1,#test2{border:3px #000 solid;padding :5px;color:#123456;background-color:#ccc;} strong{color:red;}

CSS processing will ignore <!--, at this time the JS part is just a CSS comment/ * js */, and when processing JS, convert <!-- into //, which is a single-line comment of JS. The single-line comment will remove the following /* and */, and also remove the CSS. No more nonsense, see Demonstration example.

When running on the Internet, you need to output a "*/*" header through the program, otherwise MIME is incorrect and some browsers will not work. PHP is like this:

Theoretically, the MIME that specifies a certain suffix on the server is "* /*” application also works, but I didn’t try it. Writing JS and CSS in the same file is particularly suitable for third-party calls. Although the file is a bit larger, it can reduce the number of requests by half. Shuaishuaidi

Of course, writing in this format is difficult It's very unpleasant, but you can just cooperate with the program to read the original file and process it. This way you can keep the original file and facilitate maintenance, and the output file saves requests. If you want, you can process the cache, which is almost the same as a static file. There is a C# one here, which is said to be official. Mine is for PHP. Because I haven’t written the caching mechanism yet, I won’t show it out to shame. In fact, the principle is very simple. You can get it done in a few clicks if you know how to program.

Actually, I want to find a way to merge multiple CSS. Combining one is not difficult. It can be difficult to handle the separation of modules while caching on the client and facilitating program calls. Unlike JS, CSS can be called asynchronously on the client. Can anyone tell me a good way?

The legendary test The legendary tester number one. If you see that I have a border and a color, that means the CSS is working.

Legendary JS tester. If you see me, the JS also works

Copy the code The code is as follows: Use the same file: jscss.php The content of jscss.php window.onload=function(){ document.getElementById("test2").innerHTML="The legendary JS tester. If you see me, then JS also works "; } Copyright © 2006-2007 aaoao , Some Rights Reserved .