快速熟悉 Matery 代码


一、语言

1.1 HTML

1.1.1 简介

超文本标记语言(英语:HyperText Markup Language,简称:HTML)是一种用于创建网页的标准标记语言。

您可以使用 HTML 来建立自己的 WEB 站点,HTML 运行在浏览器上,由浏览器来解析。

1.1.2 总览

image-20210912125724400

1.1.3 教程网站

菜鸟教程 :https://www.runoob.com/html/html-intro.html

W3School: https://www.w3school.com.cn/tags/index.asp

1.2 JavaScript

1.2.1 简介

JavaScript 是互联网上最流行的脚本语言,这门语言可用于 HTML 和 web,更可广泛用于服务器、PC、笔记本电脑、平板电脑和智能手机等设备。

JavaScript 是一种轻量级的编程语言。

JavaScript 是可插入 HTML 页面的编程代码。

JavaScript 插入 HTML 页面后,可由所有的现代浏览器执行。

1.2.2 本博客常用内容

ES2015(ES6) 新增加了两个重要的 JavaScript 关键字: letconst

let 声明的变量只在 let 命令所在的代码块内有效。

const 声明一个只读的常量,一旦声明,常量的值就不能改变。

在 ES6 之前,JavaScript 只有两种作用域: 全局变量函数内的局部变量

1.2.3 教程网站

菜鸟教程 :https://www.runoob.com/js/js-tutorial.html

1.3 CSS

1.3.1 简介

  • CSS 指层叠样式表 (Cascading Style Sheets)
  • 样式定义如何显示 HTML 元素
  • 样式通常存储在样式表
  • 把样式添加到 HTML 4.0 中,是为了解决内容与表现分离的问题
  • 外部样式表可以极大提高工作效率
  • 外部样式表通常存储在 CSS 文件
  • 多个样式定义可层叠为一个

1.3.2 本博客常用

1.3.2.1 声明 id

CSS 中使用 # + idName 来声明 id,例如:#cardId、#fogImage

1.3.2.2 声明类

CSS 中使用 “.” 来声明类,例如:.bookClass、.img-item

CSS 中使用 @ 来声明媒体

image-20210912131156275 image-20210912131234082

1.3.3 教程网站

菜鸟教程: https://www.runoob.com/css/css-intro.html

1.4 EJS

1.4.1 简介

“E” 代表什么?可以表示 “可嵌入(Embedded)”,也可以是“高效(Effective)”、“优雅(Elegant)”或者是“简单(Easy)”。EJS 是一套简单的模板语言,帮你利用普通的 JavaScript 代码生成 HTML 页面。EJS 没有如何组织内容的教条;也没有再造一套迭代和控制流语法;有的只是普通的 JavaScript 代码而已。

1.4.2 教程网站

EJS 官网: https://ejs.bootcss.com/#docs

1.5 HTML DOM

1.5.1 简介

HTML DOM 定义了访问和操作 HTML 文档的标准。

1.5.1.1 什么是 DOM?

DOM 是 W3C(万维网联盟)的标准。

DOM 定义了访问 HTML 和 XML 文档的标准:

“W3C 文档对象模型 (DOM) 是中立于平台和语言的接口,它允许程序和脚本动态地访问和更新文档的内容、结构和样式。”

W3C DOM 标准被分为 3 个不同的部分:

  • 核心 DOM - 针对任何结构化文档的标准模型
  • XML DOM - 针对 XML 文档的标准模型
  • HTML DOM - 针对 HTML 文档的标准模型

编者注:DOM 是 Document Object Model(文档对象模型)的缩写。

1.5.1.2 什么是 HTML DOM?

HTML DOM 是:

  • HTML 的标准对象模型
  • HTML 的标准编程接口
  • W3C 标准

HTML DOM 定义了所有 HTML 元素的对象属性,以及访问它们的方法

换言之,HTML DOM 是关于如何获取、修改、添加或删除 HTML 元素的标准。

1.5.2 教程

菜鸟教程:https://www.runoob.com/htmldom/htmldom-intro.html

二、类库

2.1 JQuery

2.1.1 简介

jQuery 是一个 JavaScript 库。

jQuery 极大地简化了 JavaScript 编程。

jQuery 库可以通过一行简单的标记被添加到网页中。

jQuery 是一个 JavaScript 函数库。

jQuery 是一个轻量级的”写的少,做的多”的 JavaScript 库。

jQuery 库包含以下功能:

  • HTML 元素选取
  • HTML 元素操作
  • CSS 操作
  • HTML 事件函数
  • JavaScript 特效和动画
  • HTML DOM 遍历和修改
  • AJAX
  • Utilities

提示: 除此之外,jQuery 还提供了大量的插件。

2.1.2 教程网站

菜鸟教程:https://www.runoob.com/jquery/jquery-tutorial.html

2.2 lightGallery

2.2.1 简介

A lightweight, modular, JavaScript image and video lightbox gallery plugin. Available for React.js, Vue.js, Angular, and TypeScript.

image-20210912132143259

2.2.1 教程网站

lightGallery官网 https://www.lightgalleryjs.com/docs/getting-started/

三、Matery 流程图

block流程图.drawio


文章作者: 血魂S
版权声明: 本博客所有文章除特別声明外,均采用 CC BY 4.0 许可协议。转载请注明来源 血魂S !
  目录