About page and code separation

xiaoxiao2021-03-06  101

In order to avoid the situation of the ASP program and HTML code mix and write, this paper introduces a method that uses templates to separate procedures and pages, making programming easier.

When using the ASP to make a site, there is often an ASP file, and the program code and HTML code are mixed. There are many shortcomings in this way: 1. If you don't say programming, you need to design and process the page layout, resulting in a chaotic code confusion, irregular; Also need to change the ASP code, not easy to maintain.

So how do you avoid these troubles? The answer is to use the template file, separate the ASP code and the HTML page, and everything is solved. The use template has the following benefits: 1. You can replace the appearance of the entire site in a short period of time; 2. Make the programmer to abstract programming without contacting the HTML code; 3. Repeat the previous template.

Programs that use PHP will know that PHP has a template program (fastTemplate), and now how similar functions are implemented in ASP. Microsoft's ASP has two scripts: VBScript and JScript. They all have a "Regular Expression Object" (Regex), using string objects and regexp objects to easily implement template functions. Mu Feng wrote a "template.jscript.inc" file, which is attached to the article. Ability readers can improve according to their needs.

Here are the method of use. Since this file is written using JScript (of course, it is easy to turn to VBScript), so the default scripting language is set to JScript, ie the first line of the ASP program should be: <% @ language = jscript%>, then then Contains template program files: .

First introduce the use of the Template class: 1. Create a Template object: Template (path) Parameters: Path (String Type) HTML Template file save the path. Use the New operator to establish a Template object.

Example: VAR TPL = New Template ("C: // Template");

You can use TPL.TPLPATH in the program to get the template path, or you can change the template path through TPL.TPLPath. Such as: tpl.tplpath = "d: // template";

2. Load template file: template.load (name, file) Parameter: name (string type) is a template variable name. FILE (String Type) Template file name. This file is stored under the HTML template path. Read file file to template variable Name.

Example: Tpl.Load ("Main", "Test.htm");

At this point, the template variable main contains the content of the file Test.htm. You can use TPL.Main to access template variable "main".

Example: <% = tpl.main%> The contents of the test.htm file that just read.

3. Template splitting: template.split (name) Parameters: Name (string type) is a template variable name. Decompose the sub-template in Name.

Example: First assume that the test.htm content in the above example is: ------------------ This is the master template. The next is: SUB Template, and Third Template. ------------------ then: tpl.split ("main"); After execution, new template variables "sub", and "third" are generated, and their content is the statement between the and . And the content of the "main" template variable also changes: "This is the main template. Next is the content of {sub}" tpl.sub: "SUB template, there is {third} "TPL.THIRD is:" Third Template. "

TPLDEF and TPLEND defined statements are filled with many nesting.

4. Template Processing: Template.Parse (Name) Parameters: Name (String Type) is a template variable. Replace the string of the template with a curly parentheses to replace the content of the same name.

Example: Continued in the case of <% = Tpl.Parse ("main")%> Display: "This is the main template. Next is the SUB child template, there is {third}"

As can be seen from the example, PARSE only replaces the {sub} variable in the "Main" template, and cannot be nestled. This is intentionally designed to increase program flexibility. So how do you complete the "main" template?

Example: TPL.SUB = TPL.PARSE ("Sub"); // Process the SUB variable and processes the main variable. Response.write (TPL.PARSE ("main");

5. Customize template variables. Custom template variables are simple, you can use assignment statements to define and modify any variables:

Example: tpl.hahaha = "This is a custom variable"; tpl.third = "change the Third variable in the original template";

It should be noted that since JSCrip is case sensitive, it must pay attention to the spelling of the big write. In general, the template variables defined in the HTML template use capital.

In addition, "TPLPATH", "LOAD", "Parse", "split" variables used in the template are internal, do not do it, otherwise the program will possibly an exception.

Let's take a complete example:

Step 1: Build an HTML template file first.

Here first explain the composition of the HTML template file. First, it is almost different from the ordinary HTML file, but only a few markers. There are two tags of the template. Let's take a look at an example:

Test.htm ----------------- example </ title> <header> </ header > <Body> This is a table example. <Table> - # TPLDEF MAXX -> 10 <! - # TPLEND MAXX -> <! - Note that a MAXX template variable is defined herein and assigns 10. -> <tr> <td> x </ td> <td> x square </ td> </ tr> <! - # TPLDEF ROW -> <tr> <td> {x} </ td > <Td> {xx} </ td> </ tr> - # TPLEND ROW -> </ Table> The above has a total of {count} line data. </ Body> </ html> ----------------- From above, {x}, {xx}, {count} is the definition template variable. They will be replaced in the ASP program. And <! - # tplend row -> is defined a statement block "Row". The "ROW" block can be repeated multiple times in the ASP program.</p> <p>Step 2: Design an ASP program.</p> <p>Test.asp ------------------- <% @ language = jscript%> <! - # include file = "template.jscript.inc" -> <% VAR TPL = New Template ("c: // inetpub // wwwroot"); var str = ""; var i;</p> <p>TPL.LOAD ("Main", "Test.htm"); TPL.SPLIT ("main");</p> <p>TPL.count = 0;</p> <p>For (i = 1; i <= tpl.maxx; i ) //tpl.maxx is defined in the template as 10. {TPL.X = I; TPL.XX = i * i; str = tpl.parse ("row"); tpl.count ;} TPL.ROW = Str; TPL.MAXX = ""; // Empty this template variable To avoid being displayed. %> <% = TPL.PARSE ("Main")%> ----------------- The above program will display a square table of 1 to 10.</p> <p>Usually in the case of using a template, as long as the statement is displayed in the last line. Therefore, the entire program is very clear. At this time, as long as you edit the template file, you can change the appearance of the entire page. As for the template file, it can be any file, such as HTML file, ASP file, or even the program itself! The correlation of the program can be minimized. Use the template to make your work easier.</p> <p>Attached: Template source -------------------------------------! - File name: template. JScript.inc -> <% / ************************************************ **************** / / * TEMPLATE CLASS * / / / * Author: Mu Feng (lin.y@263.net) * // * Date: 2000-6-09 * // ******************************************************** ********* /// Template Method Define</p> <p>Function Template_Parse (Name) {IF (this [name] == null) Return ""</p> <p>Var reg = new regexp ("{(// w *)}", "iz"); var str = new string (this [name]); var arr = str.match (reg); var i;</p> <p>IF (arr! = null) for (i = 0; i <arr.length; i ) {key = arr [i] .slice (1, -1); reg = new regexp (arr [i], "ig" ); if (this [key]! = null) str = str.replace (reg, this [key]);} Return Str;}</p> <p>Function Template_Split (Name) {var len = 0; VAR Arr;</p> <p>IF (this [Name] == NULL) RETURN;</p> <p>Var Template_exp = new regexp ("<! - #) * -> ((. | // n) *) <! - # tplend // 1 * ->, "i"); while (this [name] .Search (Template_exp)! = - 1) {arr = this [name] .match (template_exp);</p> <p>This [arr [1]] = arr [2]; this [name] = this [name] .replace (template_exp, "{" arr [1] "}); this.split (Arr [1]) }}</p> <p>function Template_Load (name, filename) {var fso = new ActiveXObject ( "Scripting.FileSystemObject"); var file = fso.BuildPath (this.TplPath, filename); if (fso.FileExists (file)) {var f = fso. OpenTextFile (File, 1); this [name] = f.readall ();}}</p> <p>// Template Constructor</p> <p>Function Template (PATH) {// PropertyThis.tplpath = PATH;</p> <p>//MethodThis.Parse = Template_Parse; this.split = template_split; this.load = template_load;}%></p></div><div class="text-center mt-3 text-grey"> 转载请注明原文地址:https://www.9cbs.com/read-96302.html</div><div class="plugin d-flex justify-content-center mt-3"></div><hr><div class="row"><div class="col-lg-12 text-muted mt-2"><i class="icon-tags mr-2"></i><span class="badge border border-secondary mr-2"><h2 class="h6 mb-0 small"><a class="text-secondary" href="tag-2.html">9cbs</a></h2></span></div></div></div></div><div class="card card-postlist border-white shadow"><div class="card-body"><div class="card-title"><div class="d-flex justify-content-between"><div><b>New Post</b>(<span class="posts">0</span>) </div><div></div></div></div><ul class="postlist list-unstyled"> </ul></div></div><div class="d-none threadlist"><input type="checkbox" name="modtid" value="96302" checked /></div></div></div></div></div><footer class="text-muted small bg-dark py-4 mt-3" id="footer"><div class="container"><div class="row"><div class="col">CopyRight © 2020 All Rights Reserved </div><div class="col text-right">Processed: <b>0.043</b>, SQL: <b>9</b></div></div></div></footer><script src="./lang/en-us/lang.js?2.2.0"></script><script src="view/js/jquery.min.js?2.2.0"></script><script src="view/js/popper.min.js?2.2.0"></script><script src="view/js/bootstrap.min.js?2.2.0"></script><script src="view/js/xiuno.js?2.2.0"></script><script src="view/js/bootstrap-plugin.js?2.2.0"></script><script src="view/js/async.min.js?2.2.0"></script><script src="view/js/form.js?2.2.0"></script><script> var debug = DEBUG = 0; var url_rewrite_on = 1; var url_path = './'; var forumarr = {"1":"Tech"}; var fid = 1; var uid = 0; var gid = 0; xn.options.water_image_url = 'view/img/water-small.png'; </script><script src="view/js/wellcms.js?2.2.0"></script><a class="scroll-to-top rounded" href="javascript:void(0);"><i class="icon-angle-up"></i></a><a class="scroll-to-bottom rounded" href="javascript:void(0);" style="display: inline;"><i class="icon-angle-down"></i></a></body></html><script> var forum_url = 'list-1.html'; var safe_token = 'wMU5kfk5bs0sLPVa4l7MzSiYK_2BYY2DxlbeJQexrcLCS_2F2a4yxD0QKZdyG4o9A6UmOUbYJWKps4DjlhOiicbsHA_3D_3D'; var body = $('body'); body.on('submit', '#form', function() { var jthis = $(this); var jsubmit = jthis.find('#submit'); jthis.reset(); jsubmit.button('loading'); var postdata = jthis.serializeObject(); $.xpost(jthis.attr('action'), postdata, function(code, message) { if(code == 0) { location.reload(); } else { $.alert(message); jsubmit.button('reset'); } }); return false; }); function resize_image() { var jmessagelist = $('div.message'); var first_width = jmessagelist.width(); jmessagelist.each(function() { var jdiv = $(this); var maxwidth = jdiv.attr('isfirst') ? first_width : jdiv.width(); var jmessage_width = Math.min(jdiv.width(), maxwidth); jdiv.find('img, embed, iframe, video').each(function() { var jimg = $(this); var img_width = this.org_width; var img_height = this.org_height; if(!img_width) { var img_width = jimg.attr('width'); var img_height = jimg.attr('height'); this.org_width = img_width; this.org_height = img_height; } if(img_width > jmessage_width) { if(this.tagName == 'IMG') { jimg.width(jmessage_width); jimg.css('height', 'auto'); jimg.css('cursor', 'pointer'); jimg.on('click', function() { }); } else { jimg.width(jmessage_width); var height = (img_height / img_width) * jimg.width(); jimg.height(height); } } }); }); } function resize_table() { $('div.message').each(function() { var jdiv = $(this); jdiv.find('table').addClass('table').wrap('<div class="table-responsive"></div>'); }); } $(function() { resize_image(); resize_table(); $(window).on('resize', resize_image); }); var jmessage = $('#message'); jmessage.on('focus', function() {if(jmessage.t) { clearTimeout(jmessage.t); jmessage.t = null; } jmessage.css('height', '6rem'); }); jmessage.on('blur', function() {jmessage.t = setTimeout(function() { jmessage.css('height', '2.5rem');}, 1000); }); $('#nav li[data-active="fid-1"]').addClass('active'); </script>