JavaScript
关注
分享
扫一扫
JavaScript
足各路
要逼自己优秀, 然后骄傲的活着。
展开
-
百度地图 省份/城市边界描边处理，省市外添加半透明遮罩，河北省特殊处理
项目中有这样一个需求，使用百度地图，对河北省省边界进行描边，省份以外添加半透明遮罩。一、setTimeout(function(){ // 省/市外 添加遮罩 getBoundary('河北省');}, 1000);//指定省市进行描边处理，省市外进行半透明遮盖。function getBoundary(city){ var bdary = new BMap.Boundary(); bdary.get(city, function(rs){//获取行政区域 .原创 2020-06-09 10:17:56 · 4038 阅读 · 3 评论 -
Vue 项目优化——通过externals加载外部CDN资源，提高网页效率
默认情况下，通过import语法导入的第三方依赖包，最终会被打包合并到同一个文件(js/chunk-vendors.******.js)中，从而导致打包后单文件体积过大的问题。一、如何解决上述问题我们可以通过webpack的externals节点，来配置并加载外部的CDN资源，凡是声明在externals中的第三方依赖包，最终都不会被打包。通过排除这些包减小js/chunk-vendors.******.js文件体积。原理：打包期间，webpack会先检查externals 中是否声明第三方依赖包.原创 2020-06-24 15:12:50 · 2085 阅读 · 0 评论 -
JS 常用插件——下拉刷新、上拉加载，左右滑动，移动端调试，图片预览、放大缩小、旋转
常用插件大全、非常好用、可以达到事半功倍的效果 ~下拉刷新、上拉加载 mescroll上下左右、滑动 better-scroll移动端调试 Vconsole图片预览、放大缩小、旋转 viewerjs对象转URL, 并以&拼接 qs本地存储 storeJS动画库 Velocity.js其他插件，博主会在发现并测试使用后，继续更新，请时刻关注 ~...原创 2020-03-10 10:59:21 · 1082 阅读 · 3 评论 -
JS 判断设备是pc端or移动端
开发过程中，遇到这样一个需求，需要判断用户使用的设备是移动端还是手机端，相对应的跳转不同地址。以下三种方式均可以判断。1.判断pc端function IsPC() { var userAgentInfo = navigator.userAgent; var Agents = ["Android", "iPhone", "SymbianOS", "Windows Phone"...原创 2019-11-07 11:24:52 · 2825 阅读 · 0 评论 -
swiper5轮播一直卡在第二张或某张图，切换时仍会卡住——bug修改
使用swiper5时遇到的坑在使用swiper5时，创建了一个轮播图，有多张图片，但是总是卡在第二张图片，且点击左右箭头切换图片时，也不会切换，依然卡在第二张图。（效果图如下）不管怎么操作，一直卡在第二张图这里。经过不断修改，最后终于解决了此问题。代码如下var swiper1 = new Swiper('#swiper1', { initialSlide :0, observ...原创 2019-11-07 11:18:31 · 2498 阅读 · 0 评论 -
什么是事件流？IE 与火狐的事件机制有什么区别？ 如何阻止冒泡？
1.事件流描述的是从页面中接受事件的顺序，分为冒泡流和捕获流；2.事件冒泡是指事件从最具体的元素接收，然后逐级向上传播，直到不具体的节点（通常指文档节点）；而事件捕获相反，它是从不具体的节点开始，逐步到最具体的节点；3.IE的事件流是冒泡流，而火狐同时支持冒泡流和捕获流；4.阻止事件冒泡：e.stopPropagation()，IE则是使用e.cancelBubble = true；兼容性...原创 2019-03-15 14:28:26 · 563 阅读 · 0 评论 -
什么是 "use strict"; ? 使用它的好处和坏处分别是什么？
use ‘strict’： "严格模式"是一种在JavaScript代码运行时自动实行更严格解析和错误处理的方法。这种模式使得Javascript在更严格的条件下运行。最好只在函数内使用严格模式。例如：function doSomething() { “use strict”;&原创 2019-03-15 14:58:31 · 2079 阅读 · 0 评论 -
JS Fetch API详解，XHR、Fetch和jQuery实现ajax的不同之处
Fetch.pngWhy Fetch在开发过程中,我们向服务端发送请求,一般会使用三种方式, XMLHttpRequest(XHR)，Fetch ，jQuery实现的AJAX。其中, XMLHttpRequest(XHR)和Fetch是浏览器的原生API，jquery的ajax其实是封装了XHR。让我们首先来比较一下这三者的使用示...转载 2019-03-19 21:50:17 · 1548 阅读 · 0 评论 -
JS ES6——let和const详解、ES6声明变量的六中方法
一、let一.定义let声明的是变量二.特性 1.不会成为window的属性 2.不允许在声明之前就使用（即不存在变量提升现象） 3.只在其声明的代码块内有效 - 块级作用域{} 4.在相同作用域下，用let声明的变量不允许再重复声明 //不能再声明前使用，会报错 console.log(a); //Uncaught ReferenceError: a is...原创 2019-03-13 20:10:59 · 391 阅读 · 0 评论 -
JS 对this的深度解析，JavaScript中this的深入浅出
this关键字是JavaScript中最复杂的机制之一，是一个特别的关键字，被自动定义在所有函数的作用域中，但是相信很多JavaScript开发者并不是非常清楚它究竟指向的是什么。听说你很懂this,是真的吗？请先回答第一个问题：如何准确判断this指向的是什么？【面试的高频问题】—————————————————————————————————————————————...转载 2019-04-09 20:10:33 · 490 阅读 · 4 评论 -
VUE Error: Cannot find module 'array-includes'? 报错原因及解决办法
刚打开项目，发现昨天好好的项目不能运行，报错了！！！一脸懵逼。。。如图：报错原因：项目外层的目录名发生更改解决办法：删除node_modules文件夹 , 重新npm install , 运行项目，OK，运行成功~~~...原创 2019-05-07 10:44:43 · 9751 阅读 · 2 评论 -
JS 数组方法——every/some/filter/map/reduce
一、数组方法总结一.栈方法栈是一种后进先出的数据结构，也就是最新添加的项最早被移除。而栈中项的插入（入栈）和移除（出栈），只发生在一个位置——栈的顶部。1.push()push()方法可以接收任意数量的参数，把它们逐个添加到数组末尾。返回：修改后数组的长度。 var arr = []; arr.push("red&am原创 2019-02-16 14:23:09 · 337 阅读 · 0 评论 -
JS 数组定义及详解
一、数组简介1.什么是数组：数组就是一组数据的集合，即一组数，其表现形式就是内存中的一段连续的内存地址。2.数组定义： 1. var arr = new Array() 2 .var arr = new Array(item,item,item...); 定义时即初始化 3. var arr = new Array(length) 定义指定长度的数组 4. var arr ...原创 2019-02-14 19:59:18 · 14735 阅读 · 0 评论 -
JS if语句，switch语句——经典例子（水仙花数、瑞年）
1.根据用户输入的数据，判断水仙花数（三位数），例如：（153=1111+555+33*3）每位数字的立方和等于该数即为水仙花数。如果是水仙花数，则输出“是”，否则输出“否” 。(三位的水仙花数共有4个：153，370，371，407。) var num = prompt("请输需要判断的水仙花数(三位数):&原创 2019-01-05 12:11:15 · 2119 阅读 · 0 评论 -
JS setInterval()/setTimeout()——实现动态时间，倒计时
一.动态时间1.setInterval() 实现html部分：<head> <meta charset=&am原创 2019-01-07 19:24:03 · 9608 阅读 · 2 评论 -
JS 事件大全及详解
一、事件详解： 事件不会自己执行，需要触发(即事件被触发之后才可执行) 事件三要素： - 事件对象 - 事件名称 - 事件处理函数 常见事件写法： - 嵌入式(传统事件绑定) 优点：简单易懂 缺点：将JavaScript代码与html代码混为一起，不利于多人协作开发 例如：(直接在HTML中写入JS代码) <button onclick=&amp原创 2019-01-23 20:00:44 · 3217 阅读 · 0 评论 -
JS for循环，while循环——经典例子（菱形、空心菱形、九九乘法表、0~100的质数...）
1.菱形 var n=7; for(var i=0;i<n;i++){ for(var k=0;k<n-i;k++){ document.write('&nbsp'原创 2019-01-08 21:53:37 · 2410 阅读 · 0 评论 -
JS DOM简介及其节点
一.DOMDOM（Document Object Model）即文档对象模型，针对 HTML 和 XML 文档的 API（应用程序接口）。DOM 描绘了一个层次化的节点树，允许开发人员添加、移除和修改页面的某一部分。DOM是为了让开发人员通过js的方式操作HTML页面或者XML页面1.节点加载 HTML 页面时，Web 浏览器生成一个树型结构，用来表示页面内部结构。DOM 将这种树型结构理...原创 2019-01-19 16:47:20 · 430 阅读 · 0 评论 -
JS 匿名函数——几种不同的调用方式
匿名函数有两种用法： 1.赋值 var a=function(){}; 2.自我执行这里我总结了4种匿名函数调用方法： //1. function show(){ document.write('ni hao'); } show(); //2. (function(){ document.write('wo hao'); })();...原创 2019-01-16 20:52:27 · 32642 阅读 · 8 评论 -
JS String对象及其方法
String 对象 不等于 string每一个字符串均为 String对象的一个实例 String对象 -属性： length 字符串中字符的个数 -索引: 从0开始 取出字符串中的字符 str[索引] -遍历: for 注意： 1.字符串中每一个字符均为string类型 2.字符串本身不能被修改方法： charAt(...原创 2019-01-16 21:01:09 · 1550 阅读 · 0 评论 -
JS DOM节点属性设置、值的获取——几种不同的方法及各自的利弊
1.节点属性的设置 对象.属性名=值; 对象[属性名]=值; obj.setAttribute(pro,value) 2.节点属性值的获取： 对象.属性名 对象[属性名] obj.getAttribute(pro) 注意：前两种设置和获取属性的方法，均需要注意特殊情况 class ---> className for ---&amp原创 2019-01-22 21:05:18 · 1882 阅读 · 0 评论