Vue系列教程(05)- 基础知识快速补充(html、css、js)

简介: Vue系列教程(05)- 基础知识快速补充(html、css、js)

1. 引言

通过前面的章节,我们的对Vue有一个整体的认知了,有兴趣的同学可以参阅下:

在深入学习Vue之前,需要了解一些基础的知识,就是本文要讲解的一些前端基础知识,即htmlcssjs

2. 说说html、css及js

相信大家都有学习过html、css和js,但是一直在做后端,很少有机会去实战。

其实这些知识都能够快速地去学习的,我把这些知识列为了一个表格,方便大家有一个整体的认知:

类别 描述 主要功能点 主流框架
HTML “骨架” 一些常用的标签 Boostrap
CSS “外观样式” 选择器、盒子模型 BoostrapAnt-Design(阿里)、饿了么的(ElementUI、ivewice )、AmazeUI(一款HTML5跨屏前端框架)
JS “动作” 逻辑(判断、循环)、DOM事件(CURD节点元素内容) JQueryReactVue

对于js层,不同框架网络请求框架总结如下:

  • 默认:xhr
  • 演变:ajax
  • Vue框架:axios

小技巧:

boostrap可视化布局系统(地址:https://www.bootcss.com/p/layoutit/

,非常方便大家去布局和下载布局后的代码,效果图如下:

3. CSS预处理器

CSS是一门标记语言,因此不可以自定义变量,它的主要缺陷如下:

  • 语法不够强大,比如无法嵌套书写,导致模块化开发中需要书写很多重复的选择器;
  • 没有变量和合理的样式复用机制,使得漏记上相关的属性值必须以字面量形式重复输出,导致难以维护。

为了解决上述问题,前端开发人员会使用一种称之为“CSS预处理器”的工具。

CSS预处理器定义了一种新的语言,其基本思想是“用一种专门的开发语言,进行Web页面样式设计,再通过编译器转化为正常的CSS文件,以供项目使用”

常用的CSS预处理器有:

  • SAAS:基于Ruby,通过服务端处理,功能强大。解析效率高。需要学习Ruby语言,上手难度高于LESS
  • LESS:基于NodeJS,通过客户端处理,使用简单,功能比SASS简单,解析效率低于SASS,但实际开发中足够了,建议使用。

4. 前端教程

之前写过前端的基础知识,有兴趣的童鞋们可快速浏览并学习。

4.1 HTML

4.2 CSS

4.3 JavaScript

4.4 JQuery

4.5 Bootstrap

4.6 Ajax

4.7 调试技巧

目录
相关文章
|
2月前
|
JavaScript 前端开发 开发者
VUE 开发——Node.js学习(一)
VUE 开发——Node.js学习(一)
88 3
|
2月前
|
JavaScript 前端开发 安全
vue -- 指令 -- v-text/html/on/show/if/bind/for/model
【10月更文挑战第17天】Vue 指令是构建 Vue 应用的基础工具,掌握它们的特性和用法是成为一名优秀 Vue 开发者的重要一步。通过深入理解和熟练运用这些指令,可以打造出更加出色的前端应用。
80 50
|
1月前
|
前端开发 JavaScript
用HTML CSS JS打造企业级官网 —— 源码直接可用
必看!用HTML+CSS+JS打造企业级官网-源码直接可用,文章代码仅用于学习,禁止用于商业
135 1
|
1月前
|
前端开发 JavaScript 安全
HTML+CSS+JS密码灯登录表单
通过结合使用HTML、CSS和JavaScript,我们创建了一个带有密码强度指示器的登录表单。这不仅提高了用户体验,还帮助用户创建更安全的密码。希望本文的详细介绍和代码示例能帮助您在实际项目中实现类似功能,提升网站的安全性和用户友好性。
48 3
|
1月前
|
JSON 移动开发 数据格式
html5+css3+js移动端带歌词音乐播放器代码
音乐播放器特效是一款html5+css3+js制作的手机移动端音乐播放器代码,带歌词显示。包括支持单曲循环,歌词显示,歌曲搜索,音量控制,列表循环等功能。利用json获取音乐歌单和歌词,基于html5 audio属性手机音乐播放器代码。
114 6
|
1月前
|
JavaScript 前端开发 持续交付
构建现代Web应用:Vue.js与Node.js的完美结合
【10月更文挑战第22天】随着互联网技术的快速发展,Web应用已经成为了人们日常生活和工作的重要组成部分。前端技术和后端技术的不断创新,为Web应用的构建提供了更多可能。在本篇文章中,我们将探讨Vue.js和Node.js这两大热门技术如何完美结合,构建现代Web应用。
38 4
|
1月前
|
JavaScript 前端开发 开发者
JavaScript框架React vs. Vue:一场性能与易用性的较量
JavaScript框架React vs. Vue:一场性能与易用性的较量
36 0
|
3月前
|
JavaScript 前端开发 API
Vue学习笔记3:对比纯JavaScript和Vue实现数据更新的实时视图显示
Vue学习笔记3:对比纯JavaScript和Vue实现数据更新的实时视图显示
|
2月前
|
JavaScript 前端开发 应用服务中间件
vue前端开发中,通过vue.config.js配置和nginx配置,实现多个入口文件的实现方法
vue前端开发中,通过vue.config.js配置和nginx配置,实现多个入口文件的实现方法
194 0
|
2月前
|
JavaScript
深入解析:JS与Vue中事件委托(事件代理)的高效实现方法
深入解析:JS与Vue中事件委托(事件代理)的高效实现方法
57 0