前端学习总览

Posted Laughing

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了前端学习总览相关的知识，希望对你有一定的参考价值。

html - Web 的语言

HTML 是属于 Web 的语言，每个开发人员都应对它具备基本的了解。

你可以使用 HTML 的“标记标签”来定义网页的内容和结构。

<h1> 定义标题，而 <p> 则定义段落。

 

  • <html> 与 </html> 之间的文本描述网页
  • <body> 与 </body> 之间的文本是可见的页面内容

CSS - 层叠样式表

样式表定义如何显示 HTML 元素。

如果样式保存在外部文件中，那么仅仅通过改变 CSS 文件，你就可以改变网站中所有 HTML 页面的的样式和外观。

假如你曾试图改变所有页面中标题的字体和颜色，就很容易理解 CSS 可以在多大程度上提高你的工作效率。

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

多重样式将层叠为一个

样式表允许以多种方式规定样式信息。样式可以被规定于单个的 HTML 元素中，在 HTML 页的头元素中，或在一个外部的 CSS 文件中。甚至可以在一个单一的 HTML 文档内部引用多个外部样式表。

层叠次序

当同一个HTML元素被不止一个样式所定义时，会使用哪个样式呢？

一般而言，所有的样式会根据下面的规则层叠于一个新的虚拟样式表中，其中数字 4 拥有最高的优先权。

  1. 浏览器缺省设置
  2. 外部样式表
  3. 内部样式表（位于 <head> 标签内部）
  4. 内联样式（在 HTML 元素内部）

因此，内联样式（在 HTML 元素内部）拥有最高的优先权，这意味着它将优先于以下的样式声明：<head> 标签中的样式声明，外部样式表中的样式声明，或者浏览器中的样式声明（缺省值）。

javascript - 客户端脚本

JavaScript 用于客户端的脚本化。客户端脚本化指的是 Web 浏览器编程。

你很有必要学习 JavaScript，这样你就有能力提供动态性更强的网站内容。

一个类似 document.write("<p>" + date + "</p>") 的 JavaScript 语句，可以向 HTML 页面写入动态的文本。

在数百万张页面中，JavaScript 被用来改进设计、验证表单、检测浏览器、创建cookies，等等等等。

什么是 JavaScript？

  • JavaScript 被设计用来向 HTML 页面添加交互行为。
  • JavaScript 是一种脚本语言（脚本语言是一种轻量级的编程语言）。
  • JavaScript 由数行可执行计算机代码组成。
  • JavaScript 通常被直接嵌入 HTML 页面。
  • JavaScript 是一种解释性语言（就是说，代码执行不进行预编译）。
  • 所有的人无需购买许可证均可使用 JavaScript。

JavaScript 能做什么？

JavaScript 为 HTML 设计师提供了一种编程工具
HTML 创作者往往都不是程序员，但是 JavaScript 却是一种只拥有极其简单的语法的脚本语言！几乎每个人都有能力将短小的代码片断放入他们的 HTML 页面当中。
JavaScript 可以将动态的文本放入 HTML 页面
类似于这样的一段 JavaScript 声明可以将一段可变的文本放入 HTML 页面：document.write("<h1>" + name + "</h1>")
JavaScript 可以对事件作出响应
可以将 JavaScript 设置为当某事件发生时才会被执行，例如页面载入完成或者当用户点击某个 HTML 元素时。
JavaScript 可以读写 HTML 元素
JavaScript 可以读取及改变 HTML 元素的内容。
JavaScript 可被用来验证数据
在数据被提交到服务器之前，JavaScript 可被用来验证这些数据。
JavaScript 可被用来检测访问者的浏览器
JavaScript 可被用来检测访问者的浏览器，并根据所检测到的浏览器，为这个浏览器载入相应的页面。
JavaScript 可被用来创建 cookies
JavaScript 可被用来存储和取回位于访问者的计算机中的信息。
其他

服务器脚本能做什么呢？

  • 动态地向 web 页面编辑、改变或添加任何的内容
  • 对由 HTML 表单提交的用户请求或数据进行响应
  • 访问数据或数据库，并向浏览器返回结果
  • 为不同的用户定制页面
  • 提高网页安全性，使您的网页代码不会通过浏览器被查看到

重要事项：由于脚本在服务器上执行，因此浏览器在不支持脚本的情况下就可以显示服务器端的文件！

ASP 和 php

在 W3School，我们通过使用活动服务器页面（ASP）和超文本预处理器（PHP）来演示服务器端的脚本编程。

您无法通过查看源代码来查看 ASP 或 PHP 的源代码，您看到的仅仅是来自服务器的输出，那些纯粹的 HTML。这是因为在结果以纯粹的 HTML 发送到浏览器之前，脚本已经在服务器上执行了。

以上是关于前端学习总览的主要内容，如果未能解决你的问题，请参考以下文章

前端兼容性问题——总览

vivo商城前端架构升级-总览篇

入行前端需要学习那些内容，前端入门学习指南，web前端学习路线

适合我的前端学习路线（学习前端不迷路）

前端学习路线

前端开发面试题以及前端学习网站