- 博客(27)
- 资源 (1)
- 收藏
- 关注
原创 art-template模板引擎
1,什么是模板引擎模板引擎是JavaScript的库文件。它提供了模板语法可以使数据和html字符串拼接的更加美观,代码易于维护。2,为什么要使用模板引擎1)在ajax项目中数据和html字符串拼接导致代码混乱。拼接容易出错,增加了修改难度。2)字符串拼接实在script标签中进行的照成了业务逻辑和用户界面混合,代码不容易维护3)使用模板引擎可以提供开发效率3,模板渲染1,引人<script src="./js/template-web.js"></script>
2020-09-05 22:38:45
205
原创 Vuex的状态管理
1,什么是VuexVuex是一个专为Vue.js设计的状态管理模式它采用集中式存储管理应用的所有组件状态解决了组件之间同一状态的共享问题。但它繁琐冗余并不适合简单的小应用。2,Vuex的使用1、src目录下面新建一个vuex的文件夹2、vuex 文件夹里面新建一个store.js3、安装vuexcnpm install vuex --save4、在刚才创建的store.js引入vue 引入vuex 并且use vueximport Vue from 'vue' import Vuex
2020-08-27 09:02:25
204
原创 Koa2
1,Koa异步处理Async、Await、和Promiseasync是让方法异步,在终端node执行获取promise对象await等待异步方法执行完成,注:await必须在async方法中才可以使用。2,Koa路由在Koa中我们可以通过koa-router完成对路由的处理1)koa-router的下载npm install --save koa-router2)koa-router的引入const Koa=require('koa');const router=require('koa
2020-08-27 09:01:46
206
原创 运行npm install 出现thon Python is not set from command line or npm configuration解决方案
1.问题图片示例:解决方案:管理员权限打开执行:npm install --global --production windows-build-tools
2020-08-24 17:10:11
27102
3
原创 webpack的基本使用
1,什么是webpackwebpack是一个流行的前端项目构建工具,可以解决web开发的困境。它提供了模块化支持,代码压缩混淆,解决js兼容性问题。性能优化等特性,提高了开发效率和项目的可维护性。2,webpack的基本使用1)创建项目目录并初始化npm init -y2)创建首页及js文件3)安装jquerynpm install jQuery -S4)导入jqueryimport $ from “jquery”5)安装webpack打开项目终端输入命令 npm instal
2020-08-24 13:36:53
170
原创 Vue基础知识梳理
文章目录1,梳理思维导图2.Vue基础知识梳理3Vue指令3.1常用指令3.1.2绑定指令3.1.3分支指令3.1.4分支指令3.2.1事件修饰符3.2.2按键修饰符3.2.3自定义按键修饰符别名3.3自定义指令3.3.1Vue.directive注册全局指令3.3.2自定义局部指令4.Vue特性4.1表单基础操作4.1.1获取表单单选框中的值4.1.2获取表单复选框中的值4.1.3获取表单下拉框中的值4.2计算属性和侦听器4.2.1计算属性computed4.2.2侦听器watch5.Vue过滤器5.1过
2020-08-22 09:04:18
1370
原创 简述Vue的组件
1,组件是什么组件是Vue.js最强大的功能之一,它可以拓展html元素,并可进行封装和重复使用。2,组件的注册2.1全局注册全局注册的方法:Vue.component(‘组件名称’, { }) 第1个参数是组件名称,第2个参数是一个模板对象,当组件全局注册后所有的vue实例都可以使用。实例:<body> <div id="app"> <mycm1></mycm1> </div> <
2020-08-21 09:03:28
432
原创 vue基础核心
文章目录1,Vue是什么?2,Vue的基础指令2.1v-cloak(防止页面加载时出现闪烁)2.2v-text2.3v-html2.4v-pre2.5v-once2.6v-model2.7v-on2.7.1事件修饰符2.7.2按键修饰符2.7.3自定义按键修饰符别名、2.8v-bind2.9v-if,v-show2.10v-for2.11v-model2.11.1表单修饰符3,员工列表案例3.1,创建静态数据存放在vue的data属性中3.2,把创建好的数据渲染到页面上3.3, 添加图书3.4,修改图书3.
2020-08-18 23:42:53
448
原创 node.js图书管理小项目讲解
文章目录1,项目环境搭建1.1项目介绍1.2案例初始化2,项目的功能实现2.1打开首页面图书列表的展示2.2添加图书功能的实现2.3图书信息修改功能的实现1,项目环境搭建1.1项目介绍图书管理系统:1,通过连接数据库实现图书的增删改查操作。1.2案例初始化1,建立与项目相关的文件夹1)public静态资源2)model数据库操作3)route路由4)views模板2,初始化项目文件npm init -y3,下载所需的第三方模块npm install express mysql a
2020-08-14 01:08:05
791
1
原创 Node操作数据库
文章目录Node操作MySQL数据库1,创建数据库的连接安装MySQL的驱动模块连接数据库操作数据库调的回调函数增加数据修改数据查询数据数据的删除Node操作MySQL数据库1,创建数据库的连接安装MySQL的驱动模块npm install mysql --save安装成功后再代码块中引入:const mysql = require('mysql');连接数据库var connection = mysql.createConnection({ host: "localhost",
2020-08-13 17:52:24
265
原创 express核心
express框架1,静态托管app.use(express.static('public'))2,加载路由app.use(router);app.listen(3000,(req,res)=>{ console.log('running....');});3,注册路由的方式app.get('/about',(req,res)=>{ res.send('about');})
2020-08-12 01:11:18
364
原创 node.js核心模块基础(二)
目录node.js的核心模块1fs-文件系统模块常见的方法readFile(),readFileSync()writeFile(),writeFileSync()appendFile(),appendFileSync()copyFile(),copyFileSync()open()close()read()write()文件目录操作方法创建文件目录node.js的核心模块1fs-文件系统模块常见的方法readFile(),readFileSync()1)readFile方法用于异步读取数据。例:
2020-08-07 23:57:14
243
原创 ES6核心基础(一)
文章目录1,es6新增的关键字1.1let申明变量1.2 const申明变量2,解构赋值2.1数组模型的解构2.2对象模型的解构3,symbol3.1Symbol的创建3.2Symbol.for()的使用3.3Symbol实例唯一3.4Symbol作为对象的属性名3.5使用Symbol来替代常量3.6使用Symbol可以定义类的私有属性和方法3.7注册和获取全局变量4,Map4.1Map对象的创建1,es6新增的关键字1.1let申明变量例:let num = 10;{ let num = 1
2020-08-07 22:15:30
667
原创 node.js基础
文章目录1,Node.js的组成2,Node.js的基础语法2.1Node执行JS文件步骤2.2Node.js的全局对象global3,Node.js的模块化开发3.1javaScript开发的弊端3.2Node.js模块开发规范4,系统模块4.1系统模块fs文件读取操作4.2系统模块fs文件写入操作4.3系统文件path路径操作4.3.1路径拼接的语法4.3.2绝对路径和相对路径1,Node.js的组成2,Node.js的基础语法2.1Node执行JS文件步骤1,新建文件夹,在文件夹例建立js文
2020-08-06 16:26:15
381
原创 MySQL的基础操作(增删改查)
1,数据库的基本概念数据库是用来存储和管理数据的仓库,其特点是可持久化存储数据,使用统一的方式操作数据库方便存储和管理数据。
2020-08-05 09:28:47
228
原创 同源政策及解决方案
文章目录1,同源1.1同源是什么1.2同源政策1.3同源限制的解决方案1.3.1使用jsonp解决同源限制的问题1,同源1.1同源是什么如果两个页面的协议,域名和端口一致则这两个页面属于同一个源,其中只要有一个不相同就是不同源。1.2同源政策ajax只能向自己的服务器发送请求,例(A网站中的HTML文件只能向A网站服务器发送ajax请求,B网站中的HTML只能向B网站发送ajax请求)同源政策的目的:保护用户信息的安全,防止恶意的网站窃取。1.3同源限制的解决方案第一种jsonp 解决跨域
2020-08-04 22:19:11
381
原创 ajax的原生和jquery封装
1,什么是ajaxAjax(Asynchronous Java and XML的缩写)是一种异步请求数据的web开发技术,它可以在不重新刷新页面的情况下,通过异步请求加载后台数据,并在网页上呈现出来。2,ajax的原理3,封装ajax涉及的知识点3.1 ajax创建的对象的方法:xhr=new XMLHttpRequest();3.2 ajax准备发送:xhr.open(type,url,true);3.3 ajax的发送请求:xhr.send(null);3.4 ajax的加载函数:xh
2020-08-04 21:33:03
166
原创 Ajax基础(一)
文章目录1,Ajax简介2,GET和POST请求2.1 GET请求2.2 POST请求2.3 GET和POST请求的区别3,Ajax的使用步骤3.1创建对象3.2设置请求3.3发送请求3.4接收响应4,Ajax请求php文件4.1php中获取GET和POST请求的数据的方式4.2利用原生Ajax通过表单实现GET和POST请求5,Ajax请求text文件文件6,Ajax请求jison文件文件7,Ajax请求XML文件8,Ajax中的兼容性问题8.1创建对象的兼容性问题8.2传输汉字乱码的兼容性问题1,Aj
2020-07-31 22:10:09
527
原创 bootstrap栅格布局和常用案例
1,bootstrap中文网 : http://www.bootcss.com/英文网 : http://getbootstrap.com/2,容器2.1流体布局容器容器的width为auto,只是两边加了15px的padding。2.2固定布局容器的width会随设备分辨率的不同而生产变化分辨率阈值w >=1200 容器的width为1170 左右padding为15 (注意是borderBox)1200>w >=992 容器的width为970
2020-07-30 23:47:38
841
原创 php基础
1,php简介1,PHP(外文名:PHP: Hypertext Preprocessor,中文名:“超文本预处理器”)是一种通用开源脚本语言。),2.PHP脚本在服务器上运行3,PHP可在不同的平台上运行(windows、Linux、Unix、Mac OSX等)4,PHP与目前几乎所有的正在被使用的服务器兼容(Apache、IIS等),全球95%以上的网站都是由PHP开发的。,5,PHP提供了广泛的数据库支持。6,PHP是免费的,可以同官网下载它:www.php.net,7,PHP易于学习,并
2020-07-30 21:59:48
146
原创 jQuery事件冒泡委托及元素节点操作
1,事件冒泡在子元素与复元素绑定同类事件如(click),在触发子元素的痛同时其父级元素的绑定事件也会被触发。例:$(function(){ var $box1 = $('.father'); var $box2 = $('.son'); var $box3 = $('.grandson'); $box1.click(function() { alert('father'); }); $box2.click(function() {
2020-07-24 20:17:16
2401
原创 jQuery的事件绑定及函数
1,事件注册1)element.事件(function(){})例:<body> <div></div> <script> $(function() { // 1. 单个事件注册 $("div").click(function() { $(this).css("background", "purple"); });
2020-07-24 19:07:03
857
原创 jQuery尺寸相关,滚动事件,属性操作及循环
1尺寸相关,滚动事件1.1获取和设置元素尺寸width()、height() //获取元素width和height innerWidth()、innerHeight() //包括padding的width和height outerWidth()、outerHeight() //包括padding和border的width和height outerWidth(true)、outerHeight(true) //包括padding和border以及margin的width和heig
2020-07-23 17:58:44
164
原创 jQuery的基础操作(样式,动画,特殊效果,链式调用,click事件)
1,jQuery的样式操作1.1获取元素的样式:$("div").css("width"); 获取div的宽度$("div").css("height"); 获取div的高度1.2设置元素的样式方法一:适用于给元素设置较少样式$("div").css("width","100px");$("div").css("backgroundColor","pink");方法二:适用于给元素设置较多样式$("div").css({ width:"100px",
2020-07-22 15:12:41
235
原创 比较jQuery:nth-of-type() 选择器和:nth-child()选择器
1,说明:type : 类型child : 孩子代码说明:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>选择器比较</title> <script
2020-07-21 23:31:04
216
原创 jQuery基础选择器的使用(一)
1.1jQuery介绍及概念jQuery 是一个快速、简洁的 JavaScript 库,封装了很多定义好的函数,我们可以非常方便的调用和使用它,从而提高开发效率。1.2jQuery环境的搭建方法一(下载引用):jQuery的官网地址: https://jquery.com/,官网即可下载最新版本。 例:<script src="jquery.min.js"></script>方法二:cdn 资源库 引入的 路径 优化访问的速度 (推荐的)例:<sc
2020-07-21 22:45:51
278
ssqobj(1).html
2020-07-02
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人