整合營銷服務商
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
轉義的 HTML 字符進行轉義。
JavaScript
const unescapeHTML = str =>
str.replace(
/&|<|>|'|"/g,
tag =>
({
'&': '&',
'<': '<',
'>': '>',
''': "'",
'"': '"'
}[tag] || tag)
);示例代碼：
unescapeHTML('<a href="#">Me & you</a>');
// '<a href="#">Me & you</a>'更多內容請訪問我的網站：https://www.icoderoad.com
產生原因：
我們知道html是如這些標簽包含的格式化文本，當用瀏覽器打開時，瀏覽器內部的標簽解釋器把不同的標簽解釋為不同的含義。這時默認所有內容都是在標簽之內的，標簽本身并不是內容。如果內容中也有標簽怎么辦？這是個問題嗎？當然。當一個負責講解html是什么的頁面輸出時，html頁面中必然包含有標簽需要輸出顯示，而瀏覽器并不能智能的分清楚哪些是需要解釋哪些不需要。
解決方法：
其中一個辦法就是轉義。為了區分需要解釋和不需要解釋的<>，將不需要解釋的<>用轉義字符代替，html會將它們解釋為<>。和html一樣，其他編程語言也有一些內置特殊符號需要用這樣的方法處理，比如php中的$，下面列舉一些：
如HTML轉義符、java 轉義符、xml 轉義符、 oracle 轉義符、sql 轉義符 、sqlserver 轉義符、php 轉義符、asp 轉義符、vb轉義符、 javascript 轉義符等等，還有網址中的百分號。
轉義字符串有三部分組成:
＆符號+實體名稱/編號+；符號
例如，HTML的< >&"?的轉義字符串分別是
“＆lt;”或者“＆＃60;”
“＆gt;”或者“＆＃62;”
“＆amp;”或者“＆＃38;”
“＆quot;”或者“＆＃34;”
“＆copy;”或者“＆＃169;”
在高級編程語言中已經將轉義字符的轉義處理做成了函數。如php中的htmlspecialchars()負責將函數參數轉為對應的轉義字符串
Hyper Text Markup Language, 超文本標記語言
標記又稱為標簽(Tag), 一般語法:
<tagName></tagName>
它可以有屬性(Attribute):
<tagName attributeName="value">, 如:
<meta charset="utf-8" />
標簽也可以不成對地關閉:
<tagName />
HTML文檔由瀏覽器解釋并執行。
<!DOCTYPE html> ----- 告訴瀏覽器用html5的標準來解釋和執行該網頁
<html>
<head> ---- 頭部, 可包含meta, title等標簽
</head>
<body> ---- 主體, 包含主要內容
</body>
</html>
<meta charset="utf-8" /> 用于告訴瀏覽器用什么樣的字符編碼來解釋網頁中的文本.
常見編碼:
iso-8859-1: 純英文編碼
gbk, gb2312: 簡體中文編碼
big5: 大五碼,繁體中文編碼,主要應用于臺灣地區
utf-8: 國際首選編碼,它兼容所有的字符
除此之外, meta還可以通過keywords, description屬性對頁面關鍵詞及描述信息進行設置, 以提高搜索引擎的命中.
網頁標題, 顯示在瀏覽器選項卡的標題欄上!
h1-h6: 內容標題標簽
p: 段落
br: 換行
hr: 水平線
strong: 粗體文本
em: 斜體文本
span: 無任何特殊樣式的文本
pre: 預格式標簽,其中的內容在頁面上帶格式渲染
small: 比當前字體小的文本
空格
< 小于
> 大于
? 版權符
" 雙引號
<!-- 注釋內容 -->
<img
src="圖像地址"
title="鼠標懸停提示"
alt="圖像加載錯誤時的替代文本"
width="寬度"
height="高度"
/>
圖像地址分為2種:
1. 相對地址, 如: img/cc.jpg
2. 絕對地址, 如: http://img.bcd.com/2017/1644232421.jpg
<a href="鏈接地址" target="目標窗口">文本|圖片</a>
目標窗口:
_self: 目標頁面在當前窗口打開
_blank: 目標頁面在新窗口中打開
如果是在頁面具有frameset/frame/iframe的場景下:
_top: 在頂級窗口中打開
_parent: 在父級窗口中打開
_自定義名稱: 在指定的特定窗口中打開
三種用法:
1. 頁面間鏈接
<a href="page/login.html"></a>
2. 錨鏈接
<a href="#help"></a>
help是本頁面中一處id為help的標簽, 如: <p id="help">
或者:
help是通過a標簽命名的錨記, 如: <a name="help"></a>
3. 功能性鏈接
喚醒本地安裝的外部程序如 outlook/foxmail/qq/msn/aliwangwang...
<a href="mailto:abcdef@qq.com"></a>
div是一個容器, 常用于頁面的布局
標簽的分類:
1. 塊級標簽/塊級元素
如: div, h1-h6, p, hr
特征: 獨占容器中的一行, 其寬度是容器的100%
2. 行級標簽/行級元素
如: span, img, strong, em, a
特征1: 多個行級元素可以同處一行, 其寬度由內容來撐開(auto)
特征2: 大部分行級元素設置其width/height無效
ctrl + D : 刪除當前行
ctrl + PgUp : 當前行上移
ctrl + PgDown : 當前行下移
ctrl + / : 注釋 | 取消注釋
ctrl + shift + F : 整理代碼格式
ctrl + C : 復制當前行
ctrl + X : 剪切當前行
ctrl + V : 粘貼
ctrl + Z : 撤消上一步操作
ctrl + S : 保存當前文件
ctrl + shift + S : 保存項目中全部文件
ctrl + Enter : 在當前行的下方插入新行
ctrl + shift + Enter : 在當前行的上方插入新行
以上知識能做的效果圖
部分效果
*請認真填寫需求信息，我們會在24小時內與您取得聯系。
