I first wrote a rich interactive page. The JavaScript code contains many html tags. For example, when ajax is used to insert a li in a list, I will directly splice the data with the html tag into a complete html and insert it into ul. No matter whether the data is retrieved from the server or from the user's input-either method is the same.
This splicing process is put in a JavaScript file, which is not elegant. If you also put the style in JavaScript, the data, structure, and style are all porridge. To maintain such code, you may want to commit suicide. The most out-of-the-box approach is to put the final HTML generated on the page directly on the server side, and the ajax spit data will contain
Labels, such a page has almost no scalability. modifying a foreground style involves modifying the background code.
Later we learned that we should not customize DOM styles in JavaScript, but just define the corresponding class in the CSS file and use this class in JavaScript.
What we need to do next is to use a JavaScript template to structure the HTML (in this case, yes
Tags) are also separated from JavaScript.
There are many JavaScript templates on the market. Take handlebars as an example:
We define a template in the html of the page:
The Code is as follows:
