第二节:细说一下那些由繁变简的语法
很多人都已經知道HTML5給我們帶來了很多高大上的新標簽、新屬性,但是卻不怎么重視一些細節之處,比如:一些繁瑣的語法已經變得更加的簡潔了。這些變化雖不起眼,但卻時刻影響著我們的日常coding。今天,我們就來細說一下,那些由繁變簡的語法。
?
簡化的<!DOCTYPE>聲明
變化最大的莫過于<!DOCTYPE>,這東西放在文檔的第一行,十分重要。它的作用是告訴瀏覽器:“嘿,哥們,我用的是xxx版本的HTML,你待會渲染我的HTML頁面代碼的是記得按照這個規則來,別搞錯了啊!”
在HTML4.01的年代,這個HTML的版本有3中, 分別是: Strict、Transitional 和 Frameset。
HTML4.01聲明<!DOCTYPE>的時候,要寫成這樣,我們拿其中一個來舉例子:
????<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN""http://www.w3.org/TR/html4/strict.dtd">
?
上面的寫法,就是聲明了一個HTML 4.01中的 Strict類型版本。是不是相當繁瑣復雜,好在這段代碼編輯器一般會幫我們自動生成,無需自己動手。也正因為這樣,估計很多童鞋并不是很了解這個<!DOCTYPE>。
而現在,我們學習的HTML5,它的<!DOCTYPE>聲明只有一個版本,并且語法也簡潔了許多,看:
? ?<!DOCTYPE html>
看到這簡潔的代碼,是不是感覺整個世界都美好了。這就是HTML5給開發者帶來的方便。
?
簡化的字符集編碼charset
在HTML4.01中我們利用<meta>標簽去指定網頁的字符編碼的時候,我們得這樣寫:
? ?<meta http-equiv="content-type" content="text/html;charset=UTF-8">
但是在HTML5中,只要這樣寫就足夠了:
? ?<meta charset="UTF-8">
?
簡化的<script>用法
在HTML4.01中,我們經常使用的<script>標簽,要加上一個type屬性:
? ?<script type="text/javascript" src="demo.js"></script>
但在HTML5中,這個可以省略掉了,簡寫成這樣:
? ?<script src="demo.js"></script>
?
簡化的<link>用法
同樣,用于導入外部樣式資源CSS文件的<link>標簽也由繁變簡了,以前要這樣寫:
? ?? ?<link rel="stylesheet" type="text/css"?href="demo.css">
現在,type屬性也可以直接省略掉了:
? ?<link rel="stylesheet" href="demo.css">
?
?
更靈活的語法
此外,相比于XHTML,HTML5還提供了一些更靈活的語法。(什么是XHTML?文章底部有介紹)
在XHTML中,標簽名嚴格要求小寫:
? ?<div></div>
在HTML5中,沒有大小寫的嚴格規定,你可以大寫標簽名:
? ?<DIV></DIV>
但是,相信很多人更傾向于用小寫來表示,因為它更符合我們的閱讀習慣。這里前端君也不建議大家使用大寫字母來表示,因為這種寫法已經out了。
?
在HTML5中,屬性值的引號可選,你可以省略:
? ?<span class=box></span>
這個span標簽的class屬性值不需要用引號,瀏覽器也可以解析渲染成功。但是習慣上大家還是會用上。
?
在HTML5中,空元素閉合可選。什么是空元素呢?
空元素:并不包含任何文本內容的元素,比如:img標簽,br標簽,hr標簽等。
在XHTML中,空元素要求必須閉合的,空元素用斜杠表示閉合。比如這樣:
? ?<img src="" alt="" />???
? ?<br/>
? ?<hr/>
在HTML5中,斜杠閉合是可選的了,你可以不閉合:
? ?<img src="" alt="">
? ?<br>
? ?<hr>
有人習慣使用斜杠表示閉合,有的人喜歡更簡潔的HTML5寫法。這里前端君并沒有建議大家具體要以哪一種為準,任君選擇。不管選擇哪種方式,重要的是始終保持一致。
?
在HTML5中,元素的屬性也是可選的了,比如:
? ?<div class></div>
其實這樣的語法確實是靈活了,但除非無法抗拒,否則不推薦大家這樣寫,因為并沒有實際的效用。
XHTML是什么
你可以把XHTML理解成語法更嚴格的HTML版本,它和HTML4.01大部分是相同的,不同點在于:XHTML 元素必須被正確地嵌套、元素必須被關閉、標簽名必須用小寫字母等等,它對語法的要求更加的嚴格、更加的嚴謹。
但是HTML5的出現讓語法變得更加的寬松,開發者可以在允許的規定內,根據自己的子喜歡來寫,剩下的都交給瀏覽器去解析。
前端君的愚見
不過,前端君建議在選擇寫法的時候要遵循:符合大家的代碼閱讀習慣,代碼風格要一致。不能同一個標簽出現不同的編寫風格,也不能盲目地追求代碼簡潔而忽略了大家的代碼閱讀習慣。
本節小結
總結:HTML5讓語法變得更加的簡潔,語法要求也變得更加寬松,大家在選擇語法的時候,不放參考一下前端君的建議。
總結
以上是生活随笔為你收集整理的第二节:细说一下那些由繁变简的语法的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: [云炬创业学笔记]第二章决定成为创业者测
- 下一篇: [云炬创业学笔记]第二章决定成为创业者测