1. 程式人生 > >Html、CSS、JS程式碼註釋的規範總結

Html、CSS、JS程式碼註釋的規範總結

新增必要的註釋,對一個有責任心、有道德模範的前端必須具備的好習慣,可以大大提高程式碼的可維護性、可讀性。
首先熟悉一下html、css、js的註釋的寫法:
1、HTML註釋語法:

<!--註釋的內容-->

2、css註釋語法

/* 註釋內容 */
/* ----------文字樣式開始---------- */

3、javaScript註釋

//註釋內容
/*註釋內容*/

接下來是對註釋在這幾種程式碼中使用的位置,如何寫註釋進行總結一下。(根據個人的習慣可能不一樣
1、html註釋
使用的位置:
1)一般會使用在一些主要節點標籤結束的後邊,如:

<div class
="wrap">

<div class="main">
...
</div><!--main end-->
<div><!--wrap end-->

2)使用在一些迴圈的結束的後邊,如:

<ul class="list">
    <li>111111</li>
    <li>222222</li>
    <li>333333</li>
</ul><!--list loop-->

這一切都是為了程式在巢狀的時候更加方便、明瞭。方便了他人同時也就方便了自己。程式巢狀的很亂,到時要你去修改那也是一份挺複雜的工序。

2、css註釋
一般會使用在定義某個模組樣式的上邊,說明這段樣式是作用於哪段模組,如:

/*通用 - 評論*/
.comment{...}
/*相簿*/
.photo{...}
/*分享*/
.share{...}
/*投票*/
.vote{...}

3、javascript註釋
一般將註釋新增在某段功能函式的上邊,說明函式的功能、作者、作者資訊、修改時間。

//========================================================
//      截斷字元
//      steepvi
//      rtx:*******
//      2010-10-14
//========================================================

最後,註釋也是字元也是會有流量產生。因此當頁面釋出到正式地址的時候,最好加上一步優化流程。
壓縮過程為非逆過程,保證本地是最新的而且帶有註釋的檔案,壓縮後上傳伺服器。伺服器端的檔案不可用作本地除錯用。

相關推薦

HtmlCSSJS程式碼註釋規範總結

新增必要的註釋,對一個有責任心、有道德模範的前端必須具備的好習慣,可以大大提高程式碼的可維護性、可讀性。 首先熟悉一下html、css、js的註釋的寫法: 1、HTML註釋語法: <!--註釋的內容--> 2、css註釋語法 /* 註釋內容 */

htmlcssjs註釋規範用法

ont alt 推薦 pan 文件 strong 服務 可用 如何 成為專業的前端工程師!!! html註釋: <!--註釋內容--> css註釋: //註釋內容 單行註釋(不推薦使用,因為有的瀏覽器可能不兼容,沒有效果)/*註釋內容*/ 多

htmlcssjs原生寫一個模態彈出框,順便解決父元素半透明子元素不透明效果

script javascrip z-index htm index 彈出 rgb 特性 radi 模態框: html部分: <!-- 按鈕 --> <button id="box" onclick="pop_box()">彈出框</

復習HTMLCSSJS練習題

bsp width type nbsp alt 打勾 text image 習題 表格復選框全選 1 <!doctype html> 2 <html> 3 <head> 4 <meta charset="utf-8"&g

Django中簡單添加HTMLcssjs等文件

htm djang .py 項目 移動 資源 默認 alt templates 首先申明下自己的環境, python版本3.65 Django版本1.11.15 創建默認Django項目後 首先說下添加Html 在urls.py文件中添加如圖代碼,照抄也

html 如何訪問 jar 包裏面的靜態資源(jscss字體等)

感覺 裏的 query 源文件 需要 資源 巴巴 png dea 前言:最近兩天在嘗試寫一個工具 jar 包,裏面包含後臺處理的 java 代碼,包含前端 html、js、css、字體文件等,過程中解決了訪問 jar 包裏的靜態資源問題,所以記錄下來。 附:自己的一個

每日知識總結計劃(javaandroidreact nativeweb框架jscsshtmlajax)首頁

作為一名資訊系的學生,現在學的太多,忘得也快,但是實在不忍心辛苦理解的知識就這樣慢慢被自己忘記。 所有這篇帖子作為今天起(2018.10.16  17:32),記錄每天得知識總結首頁。 下面得帖子連結分為一個月為一個單位做記錄,每天的記錄就在當月的一個月的帖子上更新。 20

Web前端-HTMLCSSJS

概述   HTML是英文Hyper Text Mark-up Language(超文字標記語言)的縮寫,它是一種製作全球資訊網頁面標準語言(標記)。相當於定義統一的一套規則,大家都來遵守他, 這樣就可以讓瀏覽器根據標記語言的規則去解釋它。瀏覽器負責將標籤翻譯成使用者“看得懂”的格式,呈現給使用者

HTMLCSSJS與JQuery的區別

【一】HTML——Hypertext Markup Language  HTML:超文字標記語言,是靜態網頁。“超文字”就是指頁面內可以包含圖片、連結,甚至音樂、程式等非文字元素。該文件本身有頁面結構,顯示頁面內容;可以理解為網頁中的標籤,比如div、ul、p等等這些。瀏覽

htmlcssjs簡單的頁面應用

主要實現三個方面(主頁、登陸頁、註冊頁、新聞詳情頁) 其中主頁包括(上面的導航欄,中間資訊分類、資訊詳情和資訊推薦) 主頁 <!DOCTYPE html> <html lang="en"> <head> <m

nodejs搭建靜態伺服器 用Nodejs搭建伺服器訪問htmlcssjs等外部連結

第一步,俗話說的好,工欲善其事,必先利其器。既然要用node+express配置伺服器,如果電腦上沒有的話自然要先安裝這兩個大寶貝啦。 1.安裝node。到Node官網下載安裝即可,直接下一步下一步就完成了。 2.npm初始化專案。開啟終端,輸入npm init -y即可

快速上手Vue(適合懂基礎htmlcssjs的人)

快速上手Vue 前述 1. 目標是通過本文,快速瞭解Vue的基本原理和使用它進行簡單的開發 2. 只需要html、css、js基礎即可(原理涉及ES5,ES6,但對開發者來說不是必須要學的) 3. 這是根據我內部分享的PPT改寫的 目錄 1. 概述 2

iOS webView載入本地htmlcssjs檔案

1.h5本地html檔案,載入到web view上面,不需要網路亦可以加載出來。 2.h5內容格式設定檔案寫法 文章內容 在IOS開發中,可以通過webView來載入HTML檔案 步驟如下: 1.需要有一個webView,可以通過sto

IOS開發(7)WKWebView載入本地HTMLCSSJS檔案JS(解決html內訪問其他資源路徑問題)

這段時間開發IOS應用,自己本身是搞java web 和 android,搞ios應用後面還有好多坑要跳,所以學習一點就整理一點筆記。不敢保證內容都是對的,但至少,我嘗試過分析整理的。 UIWebVIew和WKWebView都是ios提供的web控制元件。但是

htmlcssjs檔案載入順序及執行情況

今天看書,看到html,css,js載入執行情況,發現自己並不是真正的瞭解,網上搜了半小時依然未弄明白,就在這時我找到了讓我恍然大悟的一段話,如下: HTML頁面載入和解析流程 1. 使用者輸入網址(假設是個html頁面,並且是第一次訪問),瀏覽器向伺服器發出請求,伺服器返回html檔案。 2. 瀏覽器開始

前端HTMLCSSJS繪製三角形的方法

<img alt="" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAHEAAABnCAYAAAA38a1WAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA2RpVFh0WE1MOmNvb

htmlcssjs載入順序

瀏覽器載入和渲染html的順序 1. IE下載的順序是從上到下,渲染的順序也是從上到下,下載和渲染是同時進行的。 2. 在渲染到頁面的某一部分時,其上面的所有部分都已經下載完成(並不是說所有相關聯的元素都已經下載完)。 3. 如果遇到語義解釋性的標籤嵌入檔案(JS指令碼,C

來點不一樣的:解耦 HTMLCSSJS之間的那些事

當前在網際網路上,任何一個稍微複雜的網站或者應用程式都會包含許多HTML、CSS 和 JavaScript。隨著網際網路運用的發展以及我們對它的依賴性日益增加,設定一個關於組織和維護你的前端程式碼的計劃是絕對需要的。 當今的一些大型網際網路公司,由於越來越多的人會接觸到

HTMLCSSJS全拼

HTML: HyperTextMark-upLanguage 即超文字標記語言; CSS:Cascading Style Sheet 層疊樣式表; JS:JavaScr

HTMlCSSJS的區別:

time ascii lib pac family 動態 fragment ref mic HTMl、CSS、JS的區別: Html:決定網頁的結構和內容----【結構】 Css:控制頁面的表現樣式,如:美化頁面----【表現】 Js:控制網頁的行為