![](https://img-blog.csdnimg.cn/085ab44011cf4f91b9eded36ee40dce7.png?x-oss-process=image/resize,m_fixed,h_224,w_224)
Web
文章平均质量分 75
Vue, Javascript, AJax, JQuery, HTML, CSS 等网页前端开发技术
BC菜鸟
偷偷的进步,我要卷死你们。
展开
-
Vue 框架
Vue 简介: ①JavaScript框架;②简化DOM操作; ③响应式数据驱动官方文档: Vue.js开发工具:VSCode (Live Server 插件)原创 2021-12-15 21:39:21 · 9567 阅读 · 0 评论 -
Vue前端路由
路由概念SPA(单页面应用程序) 中,前端路由(router)就是对应关系。(Hash地址与组件间对应关系)工作方式:用户点击页面上的路由链接 导致URL地址栏中Hash值发生变化 前端路由监听到Hash地址变化 前端路由把当前Hash地址对应组件渲染到浏览器中vue-router 基本用法vue-router 是vue.js 官方的 路由解决方案。管理SPA项目中组件切换官方地址:Vue Router① 安装 vue-router 包命令:npm i vue-ro.原创 2022-03-22 02:30:58 · 1957 阅读 · 0 评论 -
ESLint 工具
ESLint 可组装的 javaScript 和 JSX 检查工具。规范代码风格官网:ESLint - 插件化的 JavaScript 代码检测工具 - ESLint中文文档VSCode 自动格式化代码ESLint安装① 项目创建时 配置 ESLint② 配置 .eslintrc.js 配置文件"off"或者0 //关闭规则关闭"warn"或者1 //在打开的规则作为警告(不影响退出代码)"error"或者2 //把规则作...原创 2022-03-18 22:18:15 · 2736 阅读 · 0 评论 -
Vue 组件化开发
动态组件动态组件指 动态切换组件的显示与隐藏vue 提供内置 <component> 组件,专门用于实现动态组件渲染。<component :is="comName">注:<component> 切换时,组件会重新创建。可用<keep-alive> 缓存组件<keep-alive> 生命周期函数被缓存时。自动触发 deactivated 生命周期函数被激活时。自动触发 activated 生命周期函数 (第一次创建也会被激活.原创 2022-03-18 22:13:31 · 1002 阅读 · 1 评论 -
Vue 组件
组件化开发 根据封装的思想,把页面上可重用的UI结构封装为组件。组件的后缀是 .vueVue 组件三个组成部分<template> 组件模板结构<script> 组件JavaScrip行为<style> 组件的样式//Test.vue<template> <!--只能存在一个根节点--> ...原创 2022-02-09 23:55:08 · 838 阅读 · 0 评论 -
Vue cli 快速生成工程化项目
vue cli vue cli 是vue.js 开发标准工具,简化 webpack 创建工程化的 Vue 项目的过程。 中文官网:https://cli.vuejs.org/zh/ 安装命令:npm i @vue/cli -g单页面应用程序SPA:(Single Page Application)指一个Web网站只有唯一一个HTML页面,所有功能与交互都是这个唯一页面内完成。...原创 2022-02-09 23:04:40 · 561 阅读 · 0 评论 -
Webpack 项目工程化
Webpack优点前端代码模块化开发 代码压缩混淆 处理浏览器端JavaScript兼容性 性能优化Webpack安装配置 (先安装Node.js) Node.js 了解_编程菜鸟-CSDN博客 Webpack命令: npm i webpack webpack-cli -D更目录下创建 webpack.config.js修改 package.json 配置运行脚本注:webpack 4.x 和5.x 版本中默...原创 2022-01-19 23:22:05 · 894 阅读 · 0 评论 -
Express 框架
概念:基于Node.js 平台,快速、开发、极简 Web开发框架 类似与Node.js 内置http模块,用于创建Web服务器。Express 中文官网:http://www.expressjs.com.cn常见服务器搭建:Web 网站服务器:专门对外提供Web网页资源的服务器。 API 接口服务器: 专门对外提供API 接口服务。安装 命令: npm i express[@版本号]//导入包const express = ...原创 2022-01-13 11:59:44 · 367 阅读 · 0 评论 -
npm 包
Node.js 模块分类内置模块(由Node.js官方提供,例如:fs、path、http等) 自定义模块(由用户创建的 js 文件) 第三方模块(由第三方提供,使用前需要下载)使用 require() 方法加载模块。(自定义模块需要文件路径;加载模块时,会执行模块中代码)模块作用域 自定义模块中定义的 变量、方法等成员,只能在当前模块内被访问。1.module对象:存储和当前模块有关属性。2.module.exports对象:将模块内成员共享,供外界使...原创 2022-01-11 00:04:11 · 314 阅读 · 0 评论 -
Node.js 基础
Node.js 是基于Chrome V8引擎的 JavaScript 运行环境。(控制台终端执行)官方网址:http://nodejs.org/zh-cn运行环境:① 浏览器是JavaScript的前端环境。②Node.js 是JavaScrip的后端环境。fs 文件系统模块 作用:提供了一系列方法和属性 操作文件。//导入fs模块const fs = require('fs');//调用fs.redFile() 读取文件//fs.readFi...原创 2022-01-06 23:52:24 · 734 阅读 · 0 评论 -
jQuery 库学习
下载 jQuery共有两个版本的 jQuery 可供下载:一份是精简过的,另一份是未压缩的(供调试或阅读)。这两个版本都可从jQuery.com下载。Google CDN:<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js">Microsoft CDN:<script src="http://ajax.aspnetcdn.com/ajax/jQuery/j..原创 2022-01-05 11:32:33 · 625 阅读 · 0 评论 -
AJAX 异步请求数据
AJAX 的全称是Asynchronous JavaScript and XML,其中,Asynchronous是异步的意思,它有别于传统web开发中采用的同步的方式。AJAX 使用 JavaScript 在 web 浏览器与 web 服务器之间来发送和接收数据。通过在幕后与 web 服务器交换数据,而不是每当用户作出改变时重载整个 web 页面,AJAX 技术可以使网页更迅速地响应。(目的:提高用户体验,较少网络数据的传输量)A...原创 2022-01-04 14:25:06 · 942 阅读 · 0 评论 -
JavaScript 动画效果封装
function animate(element, target, callback) { clearInterval(element.move) element.move = setInterval(function() { var step = (target - element.offsetLeft) / 10 step = step > 0 ? Math.ceil(step) : Math.floor(step); if (el.原创 2022-01-04 10:10:23 · 469 阅读 · 0 评论 -
JavaScript DOM与BOM对象模型(Web API)
Dom文档对象模型处理可拓展标记语言(HTML 或 XML)的标准编程接口。作用改变网页、结构和样式。 1.文档:一个页面及文档,DOM中使用document表示 2.元素:页面中所有标签都是元素,DOM中使用element表示 3.节点:网页中的所有内容都是节点(标签、属性、文本、注释等),DOM中用node表示 事件操作(元素注册事件,采取 事件源.事件类型= 事件处理程序) 事件流:描述从页...原创 2021-12-31 23:37:27 · 777 阅读 · 0 评论 -
浏览器 flexible自适应字体大小
根据浏览器大小,设置不同字体大小。(网页刷新、缩放字体重新自适应大小)(function flexible(window, document) { // 获取的html 的根元素 var docEl = document.documentElement // dpr 物理像素比 var dpr = window.devicePixelRatio || 1 // adjust body font size 设置我们body 的字体大小 func原创 2021-12-29 23:05:54 · 688 阅读 · 0 评论