Chat HTML <! --... --> Tag

Source: Internet
Author: User
Tags comment tag
HTML & lt ;! --... -- & Gt; label Definition

The comment tag is used to insert comments in the html source code. The comment is not displayed in the browser.

Usage

The Code is as follows:

 

Browser support

All browsers support
The above are just the simplest definitions and usage methods. For more advanced usage of annotations.

Advanced Application 1. Assignment

 

2. Description of functional modules and usage

 
 
 
  • Activate
  • Default
  • Unavailable

3. Remarks on page creation

 

The above three applications are based on annotations. They describe the documents based on their non-display features in the browser to facilitate cross-group and cross-Department communication at work.

4. Functions of CSS/JS on the page

It is used to be compatible with the old version of browsers and cannot be identified by js and css. (This function is only used for understanding. Now you can basically discard it.) The Code is as follows:

《script》alert('good')《script》

morning

The above code is directly displayed on the page

.good{color:red;}alert('good')morning

Annotations can be used to prevent code Display and affect the page experience.

《script》
 《script》

morning

This processing also uses //, which is the annotation symbol of javascript to prevent js from executing -->.

5. Insert code using annotations

This is also to optimize the page by using the feature that the annotation will not be rendered by the page. It can be used to store data and templates.

 

The code here can be matched using regular expressions to retrieve the corresponding data and parse the data. The following is a simple DEMO code using jquery.

$('[is-tpl]').each(function(){console.log($(this).html())var comment=$(this).html();$(this).html(comment.replace('
 ',''));})

In this way, the code is correctly displayed. Let's think about the data to be put in the specific comment and how to handle it.

6. Use conditional annotations to be compatible with various browsers

The following condition comments Determine IE (IE10 does not support these comments). other browsers will consider the following as comments and will not parse them.

 
  
 Both Internet Explorer and Internet Explorer can be recognized.
  
  
  
  
  
  
  
  
 

The above code should be familiar to everyone, and we should have never seen it before.

There are a lot of records. Remember this and remember it according to the following rules:
A. Basic Structure:

  

B. Relationship with IE

  • Equal to null
  • Greater than or equal to gt
  • Less than <
  • Larger than or equal to gte, lte

C. Add the version number
D. Remember to use spaces in the middle.
Remember what a special web browser uses.

 Both Internet Explorer and Internet Explorer can be recognized.
  

This can be interpreted as adding intermediate code to two annotations.

The usage of these condition annotations is often seen as follows:

Conditional annotation html Tag

 
 
 
 
 
 

The style can be defined in a specific browser.

.ie6 body{}

This style is available only in the IE 6 browser.

Reference different style sheets based on Annotations

 

Load js based on conditions

In IE6, reference js supported for png24 Images

  

For DD_belatedPNG.js, it is easy for you to find related methods and libraries.

BUG issue IE6's little tail

In ie6, adding comments in the middle of the line element may produce a tail.

11231 415161 71 asdfasfd


You only need to delete comments and line breaks to solve the problem.

Comment appears before DOCTYPE

Although DOCTYPE html should not have any code before, but there are comments, there will be no problems in mainstream browsers. However, in ie7 and earlier browsers, the rendering type cannot be identified, resulting in strange mode rendering and page style disorder.

 
 Untitled document

Ie7 and below are displayed

Other front-end comments in css

/* I am a comment in css */

This is the only annotation in css.

Note: use Chinese annotations. Note that a space is added before and after the annotator to prevent the style from being read due to incorrect encoding.

Comments in js

Single line comment

// I am a single line comment

Multi-line comment

/* I am a multi-line comment and I am a multi-line comment */

We recommend that you use multi-line comments to prevent code function errors after linefeeds are deleted.

For example

Var s = 10; // defines s as 10var B = 20; console. log (B );

With less line breaks

Var s = 10; // defines s as 10var B = 20; console. log (B );

An error occurs.
If multiple rows are used

Var s = 10;/* defines s as 10 */var B = 20; console. log (B );

No error occurs in the code.

In the preceding case, when multiple JavaScript files are merged, single-line comments may also cause errors.

Summary

Through this channel, I have never thought that a comment tag can be used to sort out so many things. I have encountered some problems, such as suggestions or notes. If you have no other contact, you can leave it blank. You can give me some suggestions in the comments. Of course, I hope you like this article and follow me.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.