- 博客(34)
- 收藏
- 关注
转载 Vue 全局变量,局部变量
全局组件和局部组件1.先定义组件 Vue.component(‘组件名’, { 组件模板对象 })注意: 组件名不要使用原生的标签名, 若组件名定义时用的是驼峰命名法, 则调用时用中划线分割后小写 例如: 组件-->mtText 使用时--> <my-text></my-text>2.配置组件的模板 ...
2019-04-18 23:09:28 2108
原创 webpack打包css等文件
运行npm i style-loader css-loader --save-devmodule: { // 用来配置第三方loader模块的 rules: [ // 文件的匹配规则 { test: /\.css$/, use: ['style-loader', 'css-loader'] }//处理css文件的规则 ] }运行...
2019-04-16 22:51:01 338
原创 webpack的实时打包构建
在项目根目录中创建webpack.config.js由于运行webpack命令的时候,webpack需要指定入口文件和输出文件的路径,所以,我们需要在webpack.config.js中配置这两个路径:const path= require(“path”);module.exports={enter:path.join(__dirname,".src/index.js"),o...
2019-04-15 16:14:14 436
原创 webpack 4.x安装命令
运行npm i webpack -g全局安装webpack,这样就能在全局使用webpack的命令在项目根目录中运行npm i webpack安装到项目依赖中运行npm init -y初始化项目创建项目基本的目录结构src 和 dist,在src里新建index.html使用npm i jquery -S安装jquery类库创建index.js并书写各行变色的代码...
2019-04-15 11:12:39 256
转载 console
console.log()这个方法是前端人员最熟悉的了,几乎我们每天都会使用,除了简单的打印对象功能,那么以下两种使用方法你知道吗?1、多参数记录当我们要去比对两个对象时,想让这两个对象整齐的在两边,这时console.log()就能帮上我们的忙。2、格式化输出console.log(msg, values);这种跟C#的string.Format()有点像,console.log()能...
2019-04-14 21:59:38 274
转载 初次使用webpack 时候遇到的奇葩问题“Cannot find module 'webpack'”
https://blog.csdn.net/vivian_wang07/article/details/83587560
2019-04-11 20:12:15 1195
转载 vue-axios的使用及其get与post网络请求
https://blog.csdn.net/qq_41115965/article/details/80780264
2019-04-08 19:07:46 345
转载 浅谈Vue.js
Vue.js简介Vue.js的作者为Evan You(尤雨溪),曾任职于Google Creative Lab,虽然是Vue是一个个人项目,但在发展前景上个人认为绝不输于Google的AngularJs,下面我会将Vue与Angular(Angular 1.0+版本)做一些简单的比较。Vue的主要特点就和它官网(http://cn.vuejs.org/)所介绍的那样:(1) 简洁 (2...
2019-04-03 20:59:52 401
转载 Vue2.0 v-for 中 :key 到底有什么用?
其实不只是vue,react中在执行列表渲染时也会要求给每个组件添加上key这个属性。要解释key的作用,不得不先介绍一下虚拟DOM的Diff算法了。我们知道,vue和react都实现了一套虚拟DOM,使我们可以不直接操作DOM元素,只操作数据便可以重新渲染页面。而隐藏在背后的原理便是其高效的Diff算法。vue和react的虚拟DOM的Diff算法大致相同,其核心是基于两个简单的假设:...
2019-04-02 20:02:02 147
转载 bootstrap到底是用来做什么的
Bootstrap是Twitter推出的一个用于前端开发的开源工具包。它由Twitter的设计师Mark Otto和Jacob Thornton合作开发,是一个CSS/HTML框架。是一个做网页的框架(目前最流行的WEB前端框架),就是说你只需要写HTML标签调用它的类你就可以很快速的做一个高大上的网页,你不用担心兼容问题,提供了很多样式供你选择!比如你需要做一个网站的导航对吧,你自己写的话你...
2019-03-30 00:11:52 1829
转载 移动端click时间、touch事件、tap事件详解
转载https://www.cnblogs.com/luoguixin/p/6370201.html至 一、click 和 tap 比较两者都会在点击时触发,但是在手机WEB端,click会有 200~300 ms,所以请用tap代替click作为点击事件。singleTap和doubleTap 分别代表单次点击和双次点击。二、关于tap的点透处理在使用zepto框架的tap来移动设备浏...
2019-03-28 19:02:53 1489
转载 ajax
AJAX的全称是Asynchronous JavaScript and XML(异步的 JavaScript 和 XML)。ajax不是新的编程语言,而是一种使用现有标准的新方法。ajax是与服务器交换数据并更新部分网页的艺术,在不重新加载整个页面的情况下。ajax是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。ajax是一种用于创建快速动态网页的技术。通过在后台与服务器进行少...
2019-03-25 22:19:02 145
转载 ajax
jquery中的ajax方法参数总是记不住,这里记录一下。1.url:要求为String类型的参数,(默认为当前页地址)发送请求的地址。2.type:要求为String类型的参数,请求方式(post或get)默认为get。注意其他http请求方法,例如put和delete也可以使用,但仅部分浏览器支持。3.timeout:要求为Number类型的参数,设置请求超时时间(毫秒)。此设置将...
2019-03-18 23:19:48 190
转载 js 实现左侧菜单拖动改变宽度
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>js实现左侧菜单拖动改变宽度</
2019-03-07 19:18:20 583
转载 transform 和@keyframes
转自文章 https://segmentfault.com/a/1190000004460780#articleHeader5一、transform 和@keyframes动画的区别:@keyframes动画是循环的,而transform 只执行一遍.二、@keyframesCSS3中添加的新属性animation是用来为元素实现动画效果的,但是animation无法单独担当起实现动画...
2019-02-28 23:27:45 512
原创 初步了解ajax
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><script&am
2019-02-25 19:55:51 145
原创 .attr 与. css
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> body { backgr
2019-02-22 20:41:04 379
原创 jq封装之手风琴
jquery封装部分$.fn.acc = function (colors, width) { colors = colors || [] width = width || 100; var $li = this.find("li"); var maxlength = this.width() - width * ($li.length - 1); var...
2019-02-21 18:09:58 236
原创 jq星星点评
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head> ..
2019-02-20 21:42:39 408
原创 jquery的一些方法
<script> window.function () { console.log("入口函数") } //jquert===>$ // 文档准备好了可以执行了 $(document).ready(function () { ...
2019-02-19 23:13:41 143
原创 模拟输入事件
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css">
2019-01-23 21:05:12 510
原创 获取url路径字符
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><script&am
2019-01-22 18:50:56 251
转载 祝福墙
<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> <style> body { margin: 0 au
2019-01-21 20:28:12 311 2
转载 购物车
<div class="catbox"> <table id="cartTable"> <thead> <tr> <th><label> <input class="check-all
2019-01-20 15:35:07 199 1
转载 随机方块
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> #map{ width: 8
2019-01-17 18:18:09 506
原创 对比图片放大
<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title>哈哈</title> <style> * { margin: 0;
2019-01-16 20:16:16 210
原创 变速移动
function animate( element, json ,fn) { //清除定时器 clearInterval(element.timeId) element.timeId = setInterval(function () { var flag = true;// 假设到达目标为止 for(var attr in json){ ...
2019-01-15 19:11:35 218
转载 轮播图
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <link rel="stylesheet" href="style
2019-01-14 21:42:44 109
原创 添加table元素
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> div{ width: 30
2019-01-10 22:23:26 682
原创 tab切换
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> * { margin: 0;
2019-01-09 21:52:04 131
原创 web api.2
封装一个函数function my$(id){ return document.getElementById(id);}图片转换<a href="1.jpg" id="a"> <img src="2.jpg id="b"></a> var x = document.getElementById(b); x.on
2019-01-08 19:23:00 142
原创 web api dom
document.getElementById()//根据id属性锁定,试用于单个属性document.getElementsByTagName()更具标签锁定试用于相同的多个标签且返回一个伪数组通过 var x= document.getElementsByTagName("");var y= Array.prototype.slice.call(x) ;转化为数组例子:...
2019-01-07 18:51:37 285
原创 javaScript 字符串常用属性 2019.1.3
字符串常用属性 .length 字符串长度 .charAt(索引) 返回值是指定索引的位置 超出着返回空 .concat()返回字符串拼接 用变量去调用 .indexof() 要找的字符串,从某个位置的索引值,返回的是这个字符串的索引值,找不到则返回-1; .replace(原字符串,新的字符串)替换字符串 .slice(开始的索引,结束的索引)截取0-5的字符串,不...
2019-01-03 19:27:31 156
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人