首页 > html教程 > 正文

前端开发中要如何注释语句?注释的三种方法(介绍)

原创 2018-09-15 17:37:52 0 90
赞助会员专享特权
在前端开发中,往往为了一些原因(比如:代码说明,标注等等),需要用到注释语句。那么到底要怎样注释注释语句,注释语句的一些注意事项是什么?本章给大家带来前端开发中要如何注释语句?注释的三种方法(介绍)。有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。

一、HTML<!--...--> 标签

1.定义:

注释标签用于在html源代码中插入注释。注释不会显示在浏览器中。

2.用法

<!--xxxxxx(需要注释的语句)-->

代码实例:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>HTML <!--...--> 标签</title>
		<style>
			*{
				margin: 0;
				padding: 0;
			}
			.demo{
				width: 200px;
				height: 100px;
				margin: 50px auto;
			}
			ul li{
				width: 20px;
				height: 20px;
				float: left;
				margin: 10px;
				list-style: none;
				background-color: #70DBDB;
			}
		</style>
	</head>
	<body>
		<div class="demo">
			<p>1~5的数字,不会显示2</p>
			<ul>
				<li>1</li>
				<!--<li>2</li>-->
				<li>3</li>
				<li>4</li>
				<li>5</li>
			</ul>
		</div>
	</body>
</html>

效果图:

1.jpg

上例中,数字2之所以在显示器上显示不出来,就是因为显示数字2的那串代码被注释了,无法显示。

<!--...--> 标签可以做到多行注释,只能在HTML文件中使用,用来注释HTML源代码。

二、//--单行注释

双斜杠注释行(//)是只能用于JavaScript源代码的注释,只能实现单行注释。

代码实例:

<script type="text/javascript">
//alert("Hello World!")
</script>

运行上面代码,不会弹出"Hello World!"的对话框。

三、/*...*/--多行注释

斜杠星注释(/*...*/)可以用于css源代码和JavaScript源代码的注释,可以实现多行一起注释。

在css源文件中:

/* 注释内容 */ 
/* ----------文字样式开始---------- */ 
/* 白色12象素文字 */ 
.dreamduwhite12px 
{ 
color:white; 
font-size:12px; 
} 
/* 黑色16象素文字 */ 
.dreamdublack16px 
{ 
color:black; 
font-size:16px; 
} 
/* ----------文字样式结束---------- */

对源代码进行注释可以起到解释代码的作用,加强代码的可读性。

在JavaScript中:

/* var jb51 = "www.php.cn"; 
var jb51 = "du"; 
*/

注:

  • 在JavaScript中过多的注释会降低JavaScript的执行速度与加载速度,因此在发布网站前,需要去掉JavaScript注释。

  • 在JavaScript中,注释块(/* ... */)里不能出现(/*或*/),因为JavaScript正则表达式中可能会产生这种代码,这样会产生语法错误,因此在推荐JavaScript中使用//做为注释语句来注释代码.

总结:

在前端开发的过程中,可以使用注释对代码进行解释,加强代码的可读性,这样做有助于以后的时间对代码进行在编辑(维护或查看)。这在编写了大量代码时尤其有用;可以使用注释标签来隐藏浏览器不支持的脚本(这样就不会把脚本显示为纯文本)。

以上就是前端开发中要如何注释语句?注释的三种方法(介绍)的详细内容,更多请关注php中文网其它相关文章!

  • 相关标签:注释语句,html
  • 本文原创发布php中文网 ,转载请注明出处,感谢您的尊重!
  • 相关文章


  • 不同版本IE使用不同css(css条件注释语句用法)_CSS/HTML
  • HTML <!--...--> 注释标签的深层次作用分析_HTML/Xhtml_网页制作
  • 删除javascript中注释语句的正则表达式_javascript技巧
  • 如何去掉php源码中的注释语句?
  • html在源代码中插入注释标签<!--...-->
  • 前端开发中要如何注释语句?注释的三种方法(介绍)
  • 网友评论

    文明上网理性发言,请遵守 新闻评论服务协议

    我要评论
    独孤九贱(4)_PHP视频教程

    独孤九贱(4)_PHP视频教程

    江湖传言:PHP是世界上最好的编程语言。真的是这样吗?这个梗究竟是从哪来的?学会本课程,你就会明白了。 PHP中文网出品的PHP入门系统教学视频,完全从初学者的角度出发,绝不玩虚的,一切以实用、有用...

    独孤九贱(5)_ThinkPHP5视频教程

    独孤九贱(5)_ThinkPHP5视频教程

    ThinkPHP是国内最流行的中文PHP开发框架,也是您Web项目的最佳选择。《php.cn独孤九贱(5)-ThinkPHP5视频教程》课程以ThinkPHP5最新版本为例,从最基本的框架常识开始,将...

    独孤九贱(1)_HTML5视频教程

    独孤九贱(1)_HTML5视频教程

    《php.cn原创html5视频教程》课程特色:php中文网原创幽默段子系列课程,以恶搞,段子为主题风格的php视频教程!轻松的教学风格,简短的教学模式,让同学们在不知不觉中,学会了HTML知识。 ...

    ThinkPHP5实战之[教学管理系统]

    ThinkPHP5实战之[教学管理系统]

    本套教程,以一个真实的学校教学管理系统为案例,手把手教会您如何在一张白纸上,从零开始,一步一步的用ThinkPHP5框架快速开发出一个商业项目。

    PHP入门视频教程之一周学会PHP

    PHP入门视频教程之一周学会PHP

    所有计算机语言的学习都要从基础开始,《PHP入门视频教程之一周学会PHP》不仅是PHP的基础部分更主要的是PHP语言的核心技术,是学习PHP必须掌握的内容,任何PHP项目的实现都离不开这部分的内容,通...

    作者信息

    小白

    今天学习一小步,明天提升一大步

    最近文章
    序列化是什么意思 305
    Jade模板引擎有什么优势 768
    如何保护数据并防止JSON漏洞和劫持 695

    相关视频教程

  • html/css快速入门 html/css快速入门
  • 弹指间学会HTML+CSS 弹指间学会HTML+CSS
  • HTML+CSS基础入门教程 HTML+CSS基础入门教程
  • HTML 基础教程 HTML 基础教程
  • 相关视频章节