- 博客(37)
- 收藏
- 关注
原创 两端对齐
// html<div>姓名</div><div>手机号码</div><div>账号</div><div>密码</div>// cssdiv { margin: 10px 0; width: 100px; border: 1px solid red; te...
2019-05-05 17:25:37
338
原创 vue路由之进阶篇
一.路由组件传参router.js代码片段: { path: '/argu/:name', name: 'argu', //传入不同的参数可以进入同一个页面,实现组件的复用 component: () =&amp;gt; import('@/views/argu.vue'), props:true },组件内获取路由参数的代码片段&amp;lt;templa...
2019-02-25 17:52:37
290
转载 浏览器环境下使用js测试任何对象的某个特性是否存在
function isHostMethod(object, property) { var t = typeof object[property]; return t=='function' || (!!(t=='object' && object[property])) || t=='unknown';}//调用result = isHostMethod(xhr,...
2018-12-27 15:32:25
253
转载 JavaScript检测插件
检测浏览器中是否安装了特定的插件是一种最常见的检测例程。对于非 IE 浏览器,可以使用plugins 数组来达到这个目的。该数组中的每一项都包含下列属性name :插件的名字description :插件的描述filename :插件的文件名length :插件所处理的 MIME 类型数量一般来说, name 属性中会包含检测插件必需的所有信息,但有时候也不完全如此。在检测插件时,需要像...
2018-12-25 11:35:25
664
转载 js获取查询字符串参数
首先介绍location对象:location 是最有用的 BOM对象之一,它提供了与当前窗口中加载的文档有关的信息,还提供了一些导航功能。事实上, location 对象是很特别的一个对象,因为它既是 window 对象的属性,也是document 对象的属性;换句话说, window.location 和 document.location 引用的是同一个对象。location 对象的用...
2018-12-25 10:55:45
1610
转载 JavaScript中模仿块级作用域
JavaScript 没有块级作用域的概念。这意味着在块语句中定义的变量,实际上是在包含函数中而非语句中创建的,来看下面的例子。function outputNumbers(count){ for (var i=0; i &lt; count; i++){ alert(i); } alert(i); //计数}这个函数中定义了一个 for 循环,而变量 i 的初始值被设置为 0。...
2018-12-24 14:22:00
146
转载 js递归
递归函数是在一个函数通过名字调用自身的情况下构成的function factorial(num){ if (num &amp;lt;= 1){ return 1; } else { return num * factorial(num-1); }}这是一个经典的递归阶乘函数。虽然这个函数表面看来没什么问题,但下面的代码却可能导致它出错。var anotherFactorial =...
2018-12-24 11:13:12
168
原创 js获取/设置伪元素属性
可以像下面这样来获取和设置var style = window.getComputedStyle( document.querySelector('.count'), ':before' );var count = style.getPropertyValue("content");style .setProperty('content', 'abcdefg');也可以通过insertR...
2018-12-03 18:09:17
1566
原创 使用css3的attr属性实现一个简单的tooltip提示信息框
当要实现一个hover时显示提示信息的效果时,如果直接用title属性觉得效果太弱,而又不想引入第三方tooltip库,可以通过使用attr属性来实现。直接上主要代码片段吧:&lt;p&gt;hello &lt;span data-title="from me..."&gt;everyone&lt;/span&gt; &lt;/p&gt;
2018-12-03 10:17:25
752
原创 理清ajax跨域问题
什么是跨域问题跨域问题与浏览器的同源策略有关,那么什么是浏览器的同源策略呢?两个页面地址中的协议、域名和端口号一致,则表示同源。例如地址 https://www.google.com 和以下地址对比: 大多数情况下,在前后端分离的项目中,前端调用后端接口,当前后端不在一个域,就会产生跨域问题。 产生跨域问题的原因:(三个条件同时满足才会产生跨域问题) 浏览器限制 跨域 XMLHt...
2018-10-28 17:42:21
155
原创 javascript基础知识点总结(二)
对象是有类型的——如何获取对象的类型typeof不能获取到对象的具体类型,使用typeof获取对象类型始终返回object认为构造函数就是对象的类型,使用constructor获取对象的具体类型:arr.constructor...
2018-08-20 17:04:39
267
原创 javascript中的window对象
window对象是BOM的顶层对象,是整个javascript的顶级对象。其他对象都是该对象的子对象。js不仅可以运行在浏览器中,也可以运行在nodejs中,nodejs也是运行js的一个环境。在全局下定义的属性和方法都自动挂载在window对象下。 onload() onunload() setTimeout() clearTimeout() 倒计时案例函数的封装 ...
2018-08-20 16:53:42
1286
原创 javascript事件详解
注册、移除事件的三种方式var box=document.getElementById('box');//1box.onclick=function(){ console.log("点击后执行");};box.onclick=null;//2box.addEventListener('click',eventCode,false);box.removeEventLis...
2018-08-20 16:26:57
460
原创 javascript实现全选反选功能
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
2018-08-17 15:21:47
331
原创 javascript基础知识点总结(一)
定义数组的两种方法var a=[1,2,3];var a=new Array(1,2,3);数组的length属性既可以获取,也可以设置 并可以用于清空数组(length = 0)数组的方法push(元素),从尾部添加 pop(),从尾部删除 arr.pop():删除数组arr的最后一个 unshift(元素),从头部添加 shift(),从头部删除数组sp...
2018-08-16 17:06:07
11285
2
原创 深入学习与理解vuex
Vuex基本介绍什么是vuex?vuex是一个专为vue.js应用程序开发的状态管理模式。 状态即vue应用组件中的各变量为什么要使用vuex?当我们构建一个中大型的单页面应用程序时,vuex可以更好地帮助我们在组件外部统一管理状态。 例如一个应用的头部组件有显示购物车数量的功能,当在各个页面添加商品到购物车,此时购物车数量要反生改变,如果不使用vuex就需要重复使用emit传...
2018-08-15 17:52:40
839
原创 移动web开发与适配
常用布局方式1.定高,宽度百分比 2.flex布局 3.媒体查询媒体查询结合百分比布局@media 媒体类型 and (媒体特性){ /*css样式*/}媒体类型:screen、print 媒体特性:max-width 、max-height demo:<style> @media screen and (max-width:3...
2018-08-15 09:23:00
200
原创 vue自定义指令
vue局部指令的定义与使用在某个组件中,部分核心代码片段<p v-color="'red'">123</p>export default{ directives:{ color:function(el,binding){ el.style.color=binding.value } }...
2018-07-27 14:51:26
271
原创 vue中的过渡动画
简单示例:代码片段:<template> <div> <div class="ab"> <transition name="fade" mode="out-in"> //transition组件 name可以自定义命名name="lalal
2018-06-04 11:15:28
624
原创 vue组件中的slot插槽功能
简单示例:父组件代码片段<com-a :my-value="myVal" @my-event="getMyEvent"> <p>123</p> //父组件页面的子组件标签中写入需要插入到子组件的内容</com-a>子组件代码片段<template> <div>
2018-06-04 10:26:30
617
原创 vue中父组件向子组件传值
首先在以下案例中,App.vue是父组件,Second-module.vue是子组件。 总体来说,父传子就是这四个步骤:父组件的data中定义值,引入并调用子组件,在引用的子组件的标签上通过v-bind指令给子组件传值,子组件通过在data中定义的props属性接收父组件传过来的值然后应用到子组件里。 首先,值肯定是定义在父组件中的,供所有子组件共享,所以要在父组件的data中定义值: ...
2018-06-01 16:15:16
28292
原创 vuejs中select下拉框值的获取
代码片段{{myVal}}<select v-model="myVal"> <option v-for="item in options" :value="item.value"> {{item.name}} </option></select>data(){ return{
2018-06-01 15:10:16
28513
原创 vuejs中多选框与单选框的值获取的方法
代码片段{{myVal}}&amp;lt;input type=&quot;checkbox&quot; name=&quot;&quot; value=&quot;apple&quot; v-model=&quot;myVal&quot; /&amp;gt;&amp;lt;label&amp;gt;app
2018-06-01 14:56:52
13613
原创 vue中子组件向父组件传值
子组件a.vue部分代码片段&lt;button @click="emitMyEvent"&gt;emit&lt;/button&gt;data(){ return{ hello:'I am component a' }}methods:{ emitMyEvent(){ this.$emit('my-event',this...
2018-06-01 14:44:15
523
原创 python之print语句
print语句可以向屏幕上输出指定的文字。比如输出’hello, world’,用代码实现如下:>>> print 'hello, world'注意:当我们在Python交互式环境下编写代码时,>>>是Python解释器的提示符,不是代码的一部分。当我们在文本编辑器中编写代码时,千万不要自己添加 >>>。print语句也可...
2018-05-18 11:18:09
725
转载 python中的数据类型
计算机能处理的远不止数值,还可以处理文本、图形、音频、视频、网页等各种各样的数据,不同的数据,需要定义不同的数据类型。在Python中,能够直接处理的数据类型有以下几种:一、整数Python可以处理任意大小的整数,当然包括负整数,在Python程序中,整数的表示方法和数学上的写法一模一样,例如:1,100,-8080,0,等等。 计算机由于使用二进制,所以,有时候用十六进制表示整数比...
2018-05-18 10:58:10
252
原创 JS中的数据类型之字符串String
字符字面量String数据类型包含一些特殊的字符字面量,也叫转义序列,用于表示非打印字符,或者具有其他用途的字符,这类字符字面量有:\n, \t, \b, \r, \f, \\, \', \", \xnn, \xunn。其具体含义这里不再详细解释,有兴趣的可以自行查阅资料。以上这些字符字面量可以出现在字符串中的任意位置,而且也将被作为1个字符串来解析。例如:var txt='this is a l...
2018-05-08 16:32:57
324
原创 用js获取两数之间的随机整数的函数
function getRandom(min,max){ min=Math.ceil(min); max=Math.floor(max); return Math.floor(Math.random()*(max-min+1))+min;}ceil() 方法执行的是向上取整计算,它返回的是大于或等于函数参数,并且与之最接近的整数。...
2018-05-08 15:13:57
1806
原创 在js中创建对象的方法
在js中创建对象有3中方法,如果使用内置对象的方法创建对象也算的话就有四种。使用json创建对象var company={};company.name='tx';company.address='sz';company.produce=function(msg){ alert(msg);}使用js中的Object类型创建对象company=new Object();company...
2018-05-08 15:04:17
180
原创 关于JavaScript的数组
定义数组的两种方法:var a=[1,2,3];var a=new Array(1,2,3);数组的length属性:既可以获取,也可以设置,并且可以用来清空数组(设置 length=0)数组的方法:push(元素),从尾部添加unshift(元素),从头部添加pop(),从尾部删除——arr.pop(),删除数组arr的最后一个shift(),从头部删除——arr.shift(),删除数组ar...
2018-05-08 10:17:10
191
原创 JS中的数值范围
由于内存的限制,ECMAScript并不能保存世界上所有的数值,ES能够表示的最小数值保存在Number.MIN_VALUE中,在大多数浏览器中,这个值是5e-324;表示的最大数值保存在Number.MAX_VALUE中,在大多数浏览器中,这个值是1.7976931348623157e+308。如果计算结果超出了这个数值范围,则会被自动转成特殊的Infinity值,具体来说,如果是负数,则被转为...
2018-05-07 16:48:44
2800
原创 JS中的局部变量和全局变量
如果在函数内部使用var定义一个变量,那么这个变量就是局部变量,这个变量在函数退出后就会被销毁,例如: function test(){ var msg='hi'; //局部变量 } test(); alert(msg);//报错这里的变量msg是在函数中使用var定义的,当函数被调用时,就会创建该变量并为其赋值。而在函数调用完之后,这个变量就会被立即销毁,...
2018-05-07 16:32:39
1139
原创 使用ES6简化代码
ES发展至今,兼容性也已很好,在项目中恰当的使用ES6的语法,可以使你的代码更加的简洁优雅,并且使你写的代码看起来更加的有逼格 小函数使用箭头函数来替代 很多函数内部只有一行代码的函数,如果写个function,最少需要3行,但是用箭头函数只需一行就可以搞定了,如下实现数组从大到小排序的一个函数:var nums=[4,8,1,9,0];nums.sort(f...
2018-04-28 17:07:42
526
原创 使用es6的class和使用function的prototype两种方法定义类的区别
传统的使用function定义类:function Person(name,age){ this.name=name; this.age=age;}Person.prototype.addAge=function(){ this.age++;};Person.prototype.setName=function(name){ this.nam...
2018-04-28 12:02:35
1055
原创 点击空白处,左侧菜单栏滑出页面
html结构: 左侧菜单栏结构: 页面效果: 页面左侧中有一个按钮,左侧菜单通过点击这个按钮滑入,再次点击按钮菜单滑出,这里需要实现另一个功能是点击页面除左侧菜单栏外的空白处,左侧菜单也滑出页面。 代码实现为 $(document).click(function(e){ var _con = $('#main-sidebar'); // 设置目标区域1--左
2017-12-14 14:24:37
2018
原创 vue.js 中v-bind指令的使用
v-bind是处理HTML中的标签属性的。 例如: html:<div id="#app"> <a v-bind:href='url'></a></div>js:var app=new Vue({ el:'#app', data:{ url:'www.baidu.com' }})缩写:<a :
2017-11-30 11:54:35
1361
原创 webpack01-认识webpack
SPA技术流行后,js的复杂程度增加,需要许许多多的依赖包,还需要编译scss,Less,ES6等,所以需要webpack的辅助。尤其是现在主流的三个前端框架,可以说和webpack已经紧密相连,框架官方都推出了和自身框架依赖的webpack构建工具。
2017-11-23 16:59:17
214
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人