CSS bounce problem when page refreshes

Objective

Today in doing JSP refactoring, there is a JS method (called it a method bar) there is a Reload page statement, before refactoring, there was no problem executing the statement of the A method, but today, after I refactor some of the content, I execute the A method again, and the entire page's CSS layout jumps randomly, The user experience is not very effective. Solving Method

By searching for answers in Baidu, Google, got an answer: said is because in the JSP page has written the CSS style and the JS statement reason, I have tried a bit, will own writes the CSS to put in a CSS file, uses the <link> to introduce, will own writes the JS to also put in a JS file, with <script> introduced to.
code example:

Introduction of JS file:
<script src= "/resources/script/project_list.js" ></script>
introduction of CSS file:
<link rel= "Stylesheet" href= "/resources/css/project_list.css" >

The result is really solved ... Conclusion:

As for why, I can only guess: the style sheet written on the page will load after the page's HTML element appears, and the imported words will be loaded first. Not how to learn the front end, the basic knowledge of the front-end lack, there are know the principle of Bo friends also please enlighten, thank you.