- 博客(41)
- 收藏
- 关注
RSS订阅原创 Vue基础7 （组件 脚手架）
模块化相关规范传统开发模式主要的问题1、命名冲突2、文件依赖通过模块化解决上述问题模块化就是把单独的一个功能封装到一个模块中（文件），模块之间相互隔离，但是可以通过特定的接口公开内部成员，也可以依赖别的模块浏览器端模块化规范AMD Require.jsCMD Sea.js服务器端的模块化规范CommonJS1、模块分为单文件模块与包2、模块成员导出:moudle.exports和exports3、模块成员导入require('模块标识符')ES6模
2021-10-17 20:37:30
247
原创 vue基础5 Vue-router
# 前后端交互模式```c接口的调用- 原生ajax- JQuery 的ajax- fetch- axiousURL地址格式1、传统形式的URL格式：schema://host:port/path?query#fragmentschema:协议，例如http https ftphost:域名或者是IP地址port:端口，http默认端口80，可以省略path:路径，例如/abc/a/b/cquery:查询参数。例如uname=list&age=12frag...
2021-10-06 15:31:55
225
原创 Vue基础三
系列文章目录提示：这里可以添加系列文章的所有文章的目录，目录需要自己手动添加例如：第一章 Python 机器学习入门之pandas的使用提示：写完文章后，目录可以自动生成，如何生成可参考右边的帮助文档文章目录系列文章目录组件化开发思想组件注册组件数据交互方式组件插槽用法Vue调试工具的用法生命周期数组先关的API组件化开发思想 - 代码尽可能多的重用代码 - 自定义组件方式不太容易 - 多次使用可能导致冲突 web Components通过创建封装好的功能定制元素解决上面的问题
2021-09-10 11:00:16
121
原创 Vue基础二
系列文章目录提示：这里可以添加系列文章的所有文章的目录，目录需要自己手动添加例如：第一章 Python 机器学习入门之pandas的使用提示：写完文章后，目录可以自动生成，如何生成可参考右边的帮助文档文章目录系列文章目录表单操作1.input单行文本2.textarea多行文本3.select下拉对选4.radio单选框5.checkbox多选框6.表单修饰符自定义指令计算属性过滤器侦听器生命周期二、使用步骤1.引入库2.读入数据总结表单操作1.input单行文本2.textarea多行
2021-09-05 10:56:13
95
原创 vue基础一
系列文章目录<font color=#999AAAVue渐进式js框架声明式渲染 组件系统 客户端路由器 集中式状态管理 项目构建易用：灵活：高效1、vue的基本使用el:元素的挂载位置（值可以是css选择器或者是dom选择器）data:模型数据（值就是一个对象）2、差值表达式 将数据填充到html标签中 差值表达式支持基本的计算操作3、vue代码运行原理分析 概述编译过程的概念（vue语法 -- vue框架--原生js语法）4、提示：写完文章后，目录可以自动生成
2021-08-29 11:18:23
75
原创 web开发之响应式布局
响应式开发bootstrap前端开发框架bootstrap栅格化系统提示：写完文章后，目录可以自动生成，如何生成可参考右边的帮助文档文章目录响应式开发bootstrap前端开发框架bootstrap栅格化系统前言一、响应式开发响应式开发原理二、Bootstrap前端开发框架12.布局容器2.列嵌套列偏移列排序前言提示：这里可以添加本文要记录的大概内容：提示：以下是本篇文章正文内容，下面案例可供参考一、响应式开发示例：pandas 是基于NumPy 的一种工具，该工具是为了解决数
2021-08-26 15:00:16
732
原创 移动端web开发之rem适配布局
系列文章目录页面布局文字能够随着屏幕的大小变化而变化流式布局和flex布局主要针对于宽度布局，那高度如何设置怎么样让屏幕发生变化时候元素高度和宽度等比例缩放提示：写完文章后，目录可以自动生成，如何生成可参考右边的帮助文档文章目录系列文章目录前言一、rem单位？二、使用步骤1.引入库2.媒体查询2.lessrem实际开发适配方案1总结前言一、rem单位？示例：pandas 是基于NumPy 的一种工具，该工具是为了解决数据分析任务而创建的。二、使用步骤1.引入库代码如下
2021-08-22 15:28:28
159
原创 移动端布局
系列文章目录提示：这里可以添加系列文章的所有文章的目录，目录需要自己手动添加例如：第一章 Python 机器学习入门之pandas的使用提示：写完文章后，目录可以自动生成，如何生成可参考右边的帮助文档文章目录系列文章目录前言一、flex？二、felx布局原理1、flex2.读入数据总结前言提示：这里可以添加本文要记录的大概内容：例如：随着人工智能的不断发展，机器学习这门技术也越来越重要，很多人都开启了学习机器学习，本文就介绍了机器学习的基础内容。提示：以下是本篇文章正文内容，下面案例
2021-08-18 11:17:02
75
原创 动画原理复盘
提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档文章目录前言一、动画实现原理二、动画函数的简单封装1.注意函数需要传进两个参数，动画对象和移动的距离2.给不同元素标记不同的定时器3.缓动动画原理4.缓动动画基本代码实现5.缓动动画多个目标值之间的移动6.动画函数添加回调函数总结前言提示：这里可以添加本文要记录的大概内容：例如：随着人工智能的不断发展，机器学习这门技术也越来越重要，很多人都开启了学习机器学习，本文就介绍了机器学习的基础内容。提示：以下是本篇文章正文内容，下面案例
2021-07-20 16:09:56
218
原创 jQuery购物车案例复盘
jQuery购物车案例文章目录jQuery购物车案例*全选按钮**购物数量加减**商品小计方法*总结全选按钮1、全选思路 ：里面的3个复选框（j_checked）选中状态（checked）跟着全选按钮（chenckall）走2、因为checked是复选框的固有属性，因此利用prop（）方法获取该属性 ，（如果是自定义属性，可以用arr()或者是data()）3、把全选按钮状态赋值给3个小复选框就可以了代码如下（示例）：1、全选 全不选功能模块就是把全选按钮（checkall）的状态赋值
2021-07-02 20:08:47
133
原创 前端项目初始化
1. 安装Vue脚手架 2. 通过Vue脚手架创建项目 3. 配置Vue路由 4. 配置Element-UI组件库 5. 配置axious库 6. 初始化git远程仓库 （码云或github生成公钥并测试，按照步骤一步步来） 7. 将本地项目托管到Github或码云中后台项目的环境安装配置 1. 安装（MySQL）数据库 2. 安装node.js环境 3. 配置项目相关信息 4. 启动项目 5. 使用Postman（软件）测试（工具）后台项目接口是否正常...
2021-01-23 15:51:11
111
原创 Vue脚手架，element ui
1、脚手架用途脚手架用于快速生成Vue项目基础架构脚手架安装步骤安装3.x版本的Vue脚手架：npm install -g @vue/cli脚手架基本用法三种方法1、基于 交互式命令行 的方式，创建新版vue项目vue create my-project2.基于 图形化界面 的方式，创建新版vue项目vue cli3.基于2.x旧模板，创建旧版vue项目npm install -g @vue/cli-initvue init webpack my-projectvue 脚
2021-01-23 14:25:09
139
原创 Webpack打包步骤
1、配置webpack的自动打包文件运行npm install webpack-dev-serve -D 命令，安装支持项目打包的工具修改pakage.json ->scripts中的dev命令如下"scripts":{"dev":"webpack-dev-server" //script节点下的脚本，可以通过npm run 执行将src ->index.html中，script脚本中的路径，修改为buldle.js“”运行npm run dev 命令，重新就行打包在浏览
2021-01-22 11:45:50
572
原创 Vue常用特性
文章目录*一、常用特性*一、常用特性表单自定义指令计算属性过滤器侦听器生命周期1.1表单操作用户的交互基于Vue的表达操作input单行文本textarca 多行文本select下拉多选radio单选框checkbox多选框textarca 多行文本 需要multiple="true"来控制表单的默认跳转的组织行为<input type="submit" value="提交" @click.prevent='handle'>二、表单修饰符
2020-10-09 16:15:16
194
原创 Vue
一、什么是指令指令的本质是自定义属性指令的格式：以 v 开始1、v-cloak 指令用法插值表达式存在的问题： 闪动问题解决方法 v-提供样式 [v-clock]{ display:none;}2、在插值表达式所在的标签中添加v-clock指令原理：先通过样式隐藏内容，然后在内存中进行值的替换，替换之后在显示最终的结果数据绑定指令 v-text 填充文本（1）相比于插值表达式更加简洁 v-html 填充html片段（1）、存在安全问题（2）、本网站内部数据
2020-10-03 09:33:18
121
原创 Git基本知识
一、git配置1、设置提交人的姓名： git config --global user.name2、提交人邮件: git config --global user.email 提交人的邮箱二、git提交步骤1、git init 初始化git仓库2、git status 查看文件状态3、git add 文件列表 追踪文件4、git commit -m 提交信息 向仓库中提交代码5、git log 查看提交记录三、撤销1、暂存区里面的文件覆盖工作目录里面的文件：git cached文
2020-10-01 09:08:08
91
原创 FormData对象
1.1 FormData对象的作用1、模拟HTML表单，相当于将表单映射成表单对象，自动将表单对象中的数据拼接成请求参数的格式2、异步上传二进制文件formData对象的使用FormData二进制文件上传
2020-08-17 20:37:34
86
原创 Express基础知识
1、express使用2、什么是中间件就是一些方法。可接收用户发来的请求、可以对请求作出响应，可以请求继续交给下一个中间件继续处理，允许设置多个中间件2.1中间件两部分组成 中间件方法以及请求处理函数中间件方法有express提供，负责拦截请求，请求处理函数有开发人员提供，负责处理请求app.get(‘请求路径’，‘处理函数’) 接收并处理get请求app.post(‘请求路径’，‘处理函数’) 接收并处理post请求尝试在终端输入ndemon 02.js 出现这时需要2.2ap
2020-07-21 09:50:27
337
原创 MongoDB知识与问题
1、mongoose带三方包使用node.js操作mongodb数据库依赖node.js第三方包mongoose2、使用npm install mongoose命令下载3、开启MonGoDB ，使用net start mongoDB,否则无法连接4、开启时如果遇到以下问题则需要在电脑端cmd,以管理员权限访问，之所以会出现错误，是因为权限不够。这里需要重新安装模块npm install mongoose ,否则会出现下面的错误6、数据库的连接7、系统提示需要添加参数8、在mongod
2020-07-16 10:22:37
218
1
原创 递归函数的案例
递归函数通俗的讲就是自己调用自己，可以用来解决数学问题，如上图此案例是打印对应的序号，因为有内外两层，定义一个函数首先foreach遍历外层函数(item),否则的不存在的话遍历内层函数，这时需要用到递归函数。返回一个数据，首先定义一个对象用来存存储数据，来判断内层函数是否有item 长度是否为0。将return的值给了getID,是重新赋予o的值，最后返回o...
2020-06-16 10:35:42
295
原创 JS高级ES5新增方法forEach\some\filter
产品的价格查询使用some()是因为它返回的是布尔值，遇到true时不再迭代，而forEach\filter不会终止迭代，值得注意的是some返回的是对象，需要定义一个数组，来通过push渲染到tbody中。
2020-06-05 10:41:21
122
原创 JS高级面向对象tab栏切换
Tab栏切换 添加功能1、点击+实现添加新的选项卡和内容2、第一步：创建新的选项卡li和新的内容section3、第二步：把创建的li和section放在相应的父元素中4、以前的做法是：动态创建元素createElement,但是元素里面的内容较多，需要innerHTML赋值，在appendChild追加到父元素里面5、高级方法:利用insertAdjacentHTML()可以直接把字符串格式元素添加到父元素中6、appendChild不支持追加字符串的子元素，insertAdjecentHTM
2020-05-30 11:41:05
224
原创 电梯导航案例分析
1、当页面滚动到今日推荐模块，就让电梯导航显示出来2、当点击电梯导航页面就可以滚动到相应页面3、电梯导航模块与内容区模块意义对应4、当我们点击电梯导航某个小模块，就可以拿到当前小模块的索引号5、就可以把annimate要移动的距离求出来；当前索引号内容区模块它的offset().top6、然后执行动画即可滑动到内容模块 相应的电梯导航也会跟着滑动1、当我们点击电梯导航里面的某个li时，当前li添加current类，兄弟移除类名2、当我们页面滚动到内容区域的某个模块，左侧电梯导航，相应对应的
2020-05-25 10:58:04
797
原创 JQuery购物车案例分析
案例分析：1、里面的复选框3个j-checkedbox选中（checked）跟着全选按钮（checkall）走2、checked是复选框的固有属性，prop()方法来获取3、把全选按钮状态赋值给小复选框就行了4、每次点击小复选框就来判断，如果复选框选中的个数等于3，就把全选按钮选上，否则全选按钮不选5、:checked选择器 :checked查找被选中的表单元素增减商品数量分析模块1、...
2020-05-12 11:23:35
1335
原创 JQuery简洁版下拉菜单hover问题
HTML为重复4次的ul两种方法来实现动态一是通过mouseover和mouseout触发点击事件二是通过切换事件Toggle三是切换事件Toggle为一个函数时，鼠标经过和离开都会触发此函数。...
2020-05-03 11:01:29
474
原创 ASP.NET登录连接页面
1、登录页面实现登录三次，则显示错误，已锁定用到函数if else i-- ,在i==0时，要锁定按钮 enable=“false”!计算页面加减乘除用到RadioButtonlist控件个人介绍性别下拉框控件DropDownList 男女文本框 ListBox...
2020-04-30 09:12:21
339
原创 Js移动端轮播图
移动端轮播图与PC端基本一致自动播放图片但可以1、可以自动播放图片2、开启定时器3、移动端移动，可以用translate移动无缝滚动4、自动无缝播放5、等到过渡完成之后再去判断6、添加检测过渡完成事件 transtionend7、判断条件：如果索引号等于3，走到最后这一张，此时索引号就要复原为08、去掉过渡，重新计算index=0重新开始9、如果索引号小于0，说明反方向走，让...
2020-04-24 11:36:54
228
原创 JS移动端拖动元素
需要注意的是，书写css时，相对定位不要忘记移动端移动的核心思路：1、计算手指移动的距离：手指移动之后的坐标 -手指初始化坐标2、盒子移动距离：手指移动的距离加上盒子初始化坐标3、需要touchstart、touchmove 搭配使用4、这时需要注意区分PC端的方法mouseover mouseout mousemove5、最后e.preventDefault()是用来防止屏幕滚动的默...
2020-04-22 09:27:38
344
原创 轮播图案例
案例分析：1、点击右侧按钮一次，图片移动一张2、声明一个变量num,点击一次，自增一，让这个变量乘以图片的宽度，就是ul的移动距离3、图片的无缝滚动4、把ul的第一个li复制一份，放在ul最后面5、当图片滚动到最后面一张图片时，让ul快速的，不做动画的跳转到做左侧 left为06、同时num赋值为0，重新滚动7、自动生成最后一张照片，自动克隆8、克隆ul第一个li，cloneNode...
2020-04-20 08:51:36
298
原创 Javascript动画封装案例分析
1、封装函数的使用function animate(obj,target,callback){}定时器的使用2、缓慢的动画效果 （目标位置-现在位置）/10来实现3、直到目标位置与走的函数位置相同时，就停止，否则继续走4、因为点击按钮的次数越多，span盒子就走的越快，所以需要清除上一个定时器 即在封装函数的下面 ，设置一个清除定时器4、回调函数的使用。当span位置在800px像...
2020-04-12 15:46:16
157
原创 Javascript元素滚动scoll系列 （仿淘宝固定右侧侧边栏）和移动端区别
效果：1、原先侧边栏是绝对定位2、当页面移动到一定位置，侧边栏改为固定定位3、页面继续滚动，会让返回顶部显示出来案例分析：1、需要用页面滚动事件scoll 因为页面滚动，所以事件源是document2、滚动到某个位置，就是判断页面被卷上去的上部值3、页面被卷上去的头部：可以通过window.pageYOffset 获得 如果被卷去的是左侧 window.pageXOffset4、注意...
2020-04-10 10:33:39
707
原创 仿京东放大镜案例详细分析与模态框区别
与拖拽模拟框不同的是，模拟框是鼠标的坐标减去盒子内的坐标而放大镜来说 是得到鼠标内的坐标 之后把鼠标值给黄色的坐标1、黄色遮盖层跟随鼠标功能2、把鼠标给遮盖曾不合适 因为遮盖层坐标以父元素为准3、首先获得鼠标在盒子的坐标4、之后把 数值给遮盖层作为left和 top值5、此时用鼠标移动事件，但还是在小图片盒子内移动6、发现遮盖层位置不对，需要就去盒子宽度和高度的一半7、遮盖层不能...
2020-04-07 10:00:24
211
原创 Javascript模拟框拖拽案例详细分析
案例分析：1、点击弹出框，模块框和遮挡层就会显示出来 display:block;2、点击关闭按钮，模块框和遮挡层就会隐藏出来3、鼠标在页面中的拖拽原理：鼠标按下并且移动，之后再松开鼠标4、触发事件为鼠标按下mousedown 鼠标移动mousemove 鼠标弹起mouseup5、拖拽过程：鼠标移动中，获得最新的值赋给模态框的top和l...
2020-04-05 11:09:39
373
原创 JS中定时器的使用以及lacation对象的多个案例
5秒之后页面跳转注册绑定事件之后，需要URL部分只是 location.href得到的是整个链接 ，将跳转的页面内容赋给div ，使用定时器倒计时实现时间的变化。手机短信的倒计时案例分析：获取URL参数数据 数据在不同页面的相互传递1、第一次登录页面，里面有提交表单 action提交到index.html页面2、第二个页面，可以使用第一个页面的参数，这样实现了一个数据不同页面的...
2020-03-30 11:45:04
158
原创 仿京东按键输入内容 快递单号查询
搜索框输入案例思路：当我们按下s，光标定位到搜索框用键盘事件对象keyCode篇判断用户是否按下了s键搜索框获得焦点，使用js里面的focus()方法快递单号查询思路分析：快递单号输入内容时，上面的大盒子con显示里面的文字同时把快递单号里面的value值获取过来给con盒子作为内容如何快递单号里面为空，隐藏大号字体盒子con注意：keydown和keypress在文本框里面的特点...
2020-03-23 11:51:21
419
原创 Js如何动态创建表格
要求：1、因为里面的学生数据是动态的，需要js生成。这里模拟数据，定义好数据，数据采用对象形式存储。2、所有的数据都放在tbody里面。3、因为行多，我们需要创建多个行4、每个行里有多个单元格，继续创建单元格5、最后一列单元格删除，需要单独创建单元格首先创建数据，放在数组中定义属性。获取tbody，for循坏创建tr行，关键是要把tr放在tbody里面，赋值给他。接着创建td...
2020-03-18 12:07:48
406
原创 JS简单版发布留言 删除留言
核心思路：1 点击按钮之后，动态生成一个li,添加到ul里面2 创建li的同时，又把文本域里面的li.innerHTML赋值给li3 如果想要新的留言后面显示就用appendChild ,如果想要留言前面显示就用insertBeforeshu...
2020-03-16 12:45:42
792
2
原创 Javascript 之tap切换栏详解 及JQuery方法
HEML部分分为两个内容，包括上面的选择框和下面的内容框，分别为tab_list和tab_con。tab_list包含ul和li。下面的内容框使用div来写。值得注意的是要隐藏内容，所以在item中给了display属性none,在商品内容为block.获取tab-list和li,for循环绑定事件。再用for循环清除li的class属性，留下this.className （谁点击了谁就是...
2020-03-13 13:04:27
1188
原创 Javascript表单全选取消、全选反选案例
要求： 点击上面的复选框，下面的复选框全部选中 再次点击复选框，下面所有的复选框都不选中思路分析：下面所有的复选框的checked属性跟随全选按钮 商品 价钱 iphon8 8000 ipad P...
2020-03-11 13:28:45
538
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人