前端
BYYDMNZ
这个作者很懒,什么都没留下…
展开
-
JavaScript之location.search中文乱码的问题
JavaScript的location.search返回URL的查询字符串,这个字符串以问号开头,如下图就是该方法返回的查询字符串:获取并解析查询字符串的方法:function getQueryStringArgs() { var qs = (location.search.length>0 ? location.search.substring(1):""), args =...原创 2018-03-15 18:58:59 · 6830 阅读 · 2 评论 -
web网站集成Google登录接口之前端要做什么(nuxt.js的做法)
在自己的网站集成google登录的方法(nuxt.js): 官方文档:https://developers.google.com/identity/sign-in/web/sign-in1.根据官方文档的步骤先为自己的网站创建谷歌API控制台和客户端ID。如图: 配置项目时,选择Web浏览器客户端类型并指定应用程序的原始URI。 ...原创 2018-08-08 20:59:13 · 2796 阅读 · 1 评论 -
解决Vue引用Swiper4插件无法重写分页器样式问题
最近在尝试用nuxtjs来搭建新的站点,但是平时在jquery里面用惯的一些插件一到vue上面引用就各种不顺畅~本文记录一下在用Swiper插件来做轮播图的时候遇到的问题~至于怎么在vue里面引用插件就不累赘了,npm能告诉你~Swiper的分页器是靠mounted()挂载到Vue组件上而不是直接写在template里,所以在style scoped中写的样式无法作用到分页器的点上。解决办法是...原创 2018-07-28 16:11:17 · 3258 阅读 · 1 评论 -
前端面试题之JS对象数组去重
前几天去找实习,碰到一道JS对象数组去重的题目,解法其实与JS普通数组去重的方法类似。1.JS数组去重方法1: var arr = [1,1,2,2,2,3,4,5,6,7,8,9,9,9,10]; var newArr = [...new Set(arr)];//ES6的新语法 console.log(newArr);方法2: var arr = [1,1,2,2,2,3,4,5,6,7,8...原创 2018-06-16 16:49:05 · 1066 阅读 · 1 评论 -
前端面试题之CSS两栏布局(左栏固定,右栏随父级宽度改变)
今天去面试,面试官问了一道很常见的CSS布局题目。实现两栏布局,左栏固定宽度,右栏宽度与父级容器宽度一致,随父级容器宽度改变而改变。下面是实现代码:大致思路是给父级容器设置padding-left为左栏的宽度,给左栏设置绝对定位,定位至父级容器的左边left:0px,右栏设置宽度为100%,此时右栏的宽度随父级的宽度改变,右栏的宽度始终等于父级的宽度。例子中右栏width=800px。<di...原创 2018-06-20 22:42:43 · 745 阅读 · 0 评论 -
学习笔记-JS之forEach()和map()方法的区别
forEach()和map()方法对每一个数组元素应用一个回调函数。forEach()修改最初的数组,而map()不修改调用的数组,它返回的结果是一个新的数组。因此,使用forEach()的时候不用返回一个值,而使用map()的时候必须返回一个值。<script type="text/javascript"> /*将10进制数组转化为16进制*/ var decArr = [2...原创 2018-03-28 16:00:46 · 279 阅读 · 0 评论 -
学习笔记-JS角度和弧度之间转换
所有Math三角方法如sin()、cos()、tin()...接受弧度值,并且返回弧度值作为结果。将角度转换为弧度:var radians = degrees * (Math.PI/180);将弧度转换为角度:var degrees = radians * (180/Math.PI);...原创 2018-03-28 13:21:42 · 9570 阅读 · 0 评论 -
(新手向)如何引入使用Bootstrap之glyphicons字体图标组件
1.到bootstrap官网下载Bootstrap:点击打开链接(当前最新版本为bootstrap-3.37)2.我们需要用到的bootstrap提供的css,js,fonts等都能在下载好的bootstrap/dist文件夹里面找到fonts文件夹里的内容:3.把dist文件夹下的余下3个文件夹复制到你的项目的根目录下4.使用图标组件:test.html首先引入外部bootstrap样式 <...原创 2018-03-14 13:02:27 · 23357 阅读 · 4 评论 -
JavaScript之Math对象的属性和方法
以下内容参考至《JavaScript高级程序设计》Math对象的属性属性说明属性说明Math自然对数的底数,即常量e的值Math.LN1010的自然对数Math.LN22的自然对数Math.LOG2E以2为底e的对数Math.LOG10E以10为底e的对数Math.PIπ的值Math.SQRT1_21/2的平方根Math.SQRT22的平方根Math对象的方法1.min()和max()方法/*找出...原创 2018-03-13 23:34:14 · 739 阅读 · 0 评论 -
CSS伪选择器
伪选择器伪选择器是一种特殊的选择器,它分为伪类选择器和伪对象选择器2种。1.伪类选择器CSS提供了五种基本伪类选择器,分别对应HTML标记的五种状态。伪类选择器作用应用对象:hover定义标记在鼠标悬停(划过)时的样式所有显示标记:link定义标记在超链接状态下的样式a标签:focus定义标记在获取焦点时的样式a标签(IE浏览器不支持):visited定义标记被访问过后的样式a标签:active定...原创 2018-03-13 16:33:15 · 3424 阅读 · 0 评论 -
jQuery之层次选择器
名称举例后代选择器$("#someDiv div") 选择id为someDiv对象中的所有<div>对象父子选择器$("#someDiv>li") 选择id为someDiv对象中的直接子节点<li>对象相邻选择器$("#one+div") 选择id为one对象后面的<div>对象,#one对象与div对象同级平级选择器$("#someDiv~原创 2018-03-18 17:53:58 · 307 阅读 · 0 评论 -
纯CSS实现鼠标划过图片闪光效果 告别gif
原理hin简单,图片hover的时候移动“闪光”标签的位移,“闪光”标签由渐变白色组成。废话不多说,放出代码:li中的图片可以用自己的图片代替,为了更加逼真,可以改变标签的移动速度或者倾斜角度。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> &l原创 2018-08-17 09:28:11 · 1795 阅读 · 0 评论