- 博客(107)
- 资源 (4)
- 收藏
- 关注
RSS订阅原创 设置文字两边对齐
设置文字两边对齐1.css.text-justify{ text-align-last: justify; text-align: justify; text-justify: distribute-all-lines;}
2021-04-16 15:50:26
261
原创 js字符输入效果
js字符输入效果1.html<div id="code" class="content"> <p>相遇、相识、相知、相伴</p> <p>往后余生，请多指教</p></div>2.jsvar typewriter = function(e) { e.each(function() { var $ele = $(e), str = $ele.html(), progress = 0; $.
2020-05-22 16:52:14
414
原创 仿微信文本框，自动换行，动态高度，最大四行后滚动
仿微信文本框，自动换行，动态高度，最大四行后滚动原理：js监听textarea实时变化值，将textarea内容插入到一个和textarea相同大小的div中，且各属性相同，高度除外；之后将根据div的高度来给textarea的高度赋值，超出四行的高度时不再给textarea赋值；当监听到textarea内容只有4个回车符号时，截断内容；注意当textarea最后字符为回车时特殊处理高度。...
2020-04-29 16:13:01
914
原创 添加、获取、删除、清空全部cookie缓存数据
添加、获取、删除、清空全部cookie缓存数据1.添加$.cookie('keys', "11");$.cookie('user_id', "1113", { path: "/"});$.cookie('user_name', "张三", { path: "/", expires: 30});2.获取console.log($.cookie('keys'))co...
2020-04-29 11:36:01
1379
原创 css实现高斯模糊效果
css模糊效果1.css -webkit-filter: blur(5px); -moz-filter: blur(5px); -ms-filter: blur(5px); filter: blur(5px);
2020-04-13 10:50:58
2009
原创 根据生日判断是否大于18岁
根据生日判断是否大于18岁1.js /* * 判断平年闰年 * y:年份数字，四位 * */ function isOrdinaryYear(y) { if ((y % 4 === 0 && y % 100 !== 0) || y % 400 === 0) { return false } return true; } /* * 判...
2020-03-23 19:13:44
1638
原创 微信小程序压缩图片并上传
微信小程序压缩图片1.wxml<canvas class="canvas" style="width: {{cw0}}px; height: {{ch0}}px;" canvas-id="myCanvas0"></canvas>2.jsPage({ /** * 页面的初始数据 */ data: { scale: 0.5, cw0: ...
2020-03-15 15:35:58
2655
原创 js计时时分秒
js计时时分秒1.jsvar TimeBar = { timer: 0, hour: 0, minute: 0, second: 0, dateContent: "00:00:00", creatHtml: function() { var content = '<p class="timeBar">' + TimeBar.dateContent + '<...
2019-12-17 16:01:57
974
原创 if (! +"\v1")什么意思？
if (! +"\v1")什么意思？if (! +"\v1")判断是否为IE浏览器。IE里不能把 "\v" 处理成垂直符，所以在IE里它就是表示"\v"这个字符串，所以"\v1"为字符串。前面的+号把后面的字符串转换成数字，由于"\v1"在IE里为字符串，所以 +"\v1" 转换失败，其值为NaN。所以 !+"\v1"的值为 true，所以在IE里 if(!+"\v1")。（目前...
2019-12-05 16:14:24
778
原创 clearInterval不起作用？肯定是用法不对
clearInterval不起作用？肯定是用法不对1.场景当一个定时器可能会被多次调用的时候，只清理一次肯定会出现没有清理完全的情况，这时候给你的错觉就是“clearInterval不起作用”。2.用法var timer = null;var timerList = [];function intervalStart() { intervalEnd(); timer =...
2019-12-03 15:40:18
14667
2
原创 window.close()失效
window.close()失效1.Chrome以及其他浏览器window.opener = null;window.open(' ','_self');window.close();2.Firefoxwindow.open("about:blank", "_self").close();
2019-11-14 14:33:17
1230
转载 js一切皆对象
一切皆对象咱们经常听到JS中“一切皆对象”？ 有没有问想过这是什么意思？ 其它语言也有“一切皆对象”之说，如Python。 但是Python中的对象不仅仅是像JS对象这样的存放值和值的容器。Python中的对象是一个类。 JS中有类似的东西，但JS中的“对象”只是键和值的容器：var obj = { name: "Tom", age: 34 }实际上，JS中的对象是一种“哑”类型...
2019-10-15 14:24:08
621
转载 为什么Vue3.0使用Proxy实现数据监听？defineProperty表示不背这个锅
转载：https://juejin.im/post/5da29a87518825094e37301c?utm_medium=hao.caibaojian.com&utm_source=hao.caibaojian.com为什么Vue3.0使用Proxy实现数据监听？defineProperty表示不背这个锅导 读vue3.0中，响应式数据部分弃用了Object.defineP...
2019-10-15 13:38:56
910
原创 什么是FOUC？如何避免FOUC？
什么叫做 FOUC 浏览器样式闪烁这种现象称之为文档样式短暂失效(Flash of Unstyled Content),简称为FOUC.在引用css的过程中，如果方法不当或者位置引用不对，会导致某些页面在windows下的ie出现一些奇怪的现象，以无样式显示页面内容的瞬间闪烁，这种现象称之为文档样式短暂失效，简称FOCU原因大致为：1，使用import方法导入样式表；2，将样式表...
2019-10-11 11:06:28
1757
原创 css实现骨架屏
css实现骨架屏1.css@-webkit-keyframes skeleton-ani { 0% { left: 0 } to { left: 100% }}@keyframes skeleton-ani { 0% { left: 0 } to { left: 100% }}.skt-loading .skeleton { positi...
2019-09-20 14:11:49
2333
原创 在 HBuilderX 中怎么配置使用 Git？
在 HBuilderX 中怎么配置使用 Git？（1）安装终端；工具——插件安装——内置终端、git（2）下载安装 Git；（3）配置 Git，即配置环境变量安装完Git后，首先右单击弹出快捷菜单——属性；打开计算机系统——单击“高级系统设置”选项；系统属性里单击选择——环境变量；选择 PATH——新建；新建；确定。（4）右键你的项目...
2019-09-11 17:59:29
5158
原创 JS前端渲染大批量数据
前端渲染大批量数据这里会提出三种方法<ul></ul>1.最简单的const number = 99999;let ul = document.querySelector("ul");for (var i = 0; i < total; i++) { let li = document.createElement('li'); ...
2019-09-11 16:18:25
9010
2
原创 div模拟input/textarea实现输入文字图片
div模拟input/textarea实现输入文字图片1.css.div-edit { font-size: 15px; width: 100%; height: 40px; line-height: 20px; padding: 10px 15px; border: 1px solid #9f9f9f; border-radius: 8px; margin: 0; d...
2019-09-10 13:24:51
1334
原创 js获取ip地址等
js获取ip地址等1.引入外部js文件http://pv.sohu.com/cityjson?ie=utf-82.调用<script src="https://pv.sohu.com/cityjson?ie=utf-8"></script><script"> console.log(returnCitySN);</script&...
2019-09-05 18:57:04
380
原创 iframe+postMessage实现跨域通信
window方法：postMessage()该window.postMessage()方法安全地启用Window对象之间的跨源通信；例如，在页面和它产生的弹出窗口之间，或者在页面和嵌入其中的iframe之间。通常，当且仅当它们源自的页面共享相同的协议、端口号和主机（也称为“同源策略”）时，允许不同页面上的脚本相互访问。window.postMessage()提供一种受控制的机制来安全地规...
2019-08-22 10:57:45
494
原创 HTML5新特性
新特性HTML5 中的一些有趣的新特性：用于绘画的 canvas 元素 用于媒介回放的 video 和 audio 元素 对本地离线存储的更好的支持 新的特殊内容元素，比如 article、footer、header、nav、section 新的表单控件，比如 calendar、date、time、email、url、search1.语义标签标签 描述 <...
2019-07-25 16:12:03
526
原创 js 数组中的常用事件
js 数组中的常用事件 var oldArray = [{ name: "李晨", age: 21 }, { name: "王晓", age: 22 }, { name: "赵四", age: 23 }];目录js 数组中的常用事件1.添加2.删除...
2019-06-24 14:57:47
934
原创 html中禁止文字被选中
html中禁止文字被选中user-select：none |text| all | element取值：none:文本不能被选择text:可以选择文本all :当所有内容作为一个整体时可以被选择。如果双击或者在上下文上点击子元素，那么被选择的部分将是以该子元素向上回溯的最高祖先元素。element:可以选择文本，但选择范围受元素边界的约束说明：1.IE6-9不支持该...
2019-05-23 16:11:38
28287
原创 vue.js上拉加载
vue.js上拉加载注意事项：1.overflow属性会导致滚动事件失效2.连续下拉会导致数据加载时出现问题，给了1s的延迟<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content=...
2019-05-08 11:04:28
1275
原创 js前端根据链接生成二维码并转成图片下载
js前端根据链接生成二维码并转成图片下载依赖于jquery、jquery.qrcode.min.js1.html<div class="qrcode"></div><button onclick="downloadClick()">下载二维码</button>2.js2.1生成二维码var url = window....
2019-04-23 16:45:08
6229
1
原创 什么是Ajax以及ajax请求的步骤
什么是Ajax以及ajax请求的步骤1.Ajax是什么?Asynchronous JavaScript & XML。Ajax是web开发的一种技术。2.Ajax请求的步骤(1)创建`XMLHttpRequest`对象,也就是创建一个异步调用对象；(2)创建一个新的`HTTP`请求,并指定该`HTTP`请求的方式、`URL`及验证信息；(3)设置响应`HTTP`请求状...
2019-04-18 15:56:10
15145
原创 vue脚手架搭建以及常见问题（附解决方案）
vue脚手架搭建以及常见问题（附解决方案）node.js安装后1.全局安装vue-clinpm install -g @vue/cli2.生成项目名为projectName的模模板vue init webpack projectName 3.安装依赖npm install4.运行npm run dev 5.路由npm install...
2019-04-17 11:26:22
2990
原创 css变量
css变量1.html<body> <header id="main-header"> <h1>css 变量</h1> </header> <div class="container"> <div class="grid"> ...
2019-04-17 11:13:34
236
原创 前端常见知识总结
前端常见知识总结1.盒模型盒模型由margin、border、padding、content组成。盒模型有两种标准，一个是标准模型，一个是IE模型。标准盒模型的宽高只是内容（content）的宽高，而在IE中盒模型的宽高为边框（border）+填充（padding）+内容（content）的总宽高。2.sessionStorage、localStorage和cookie的区别共同点...
2019-03-26 09:23:08
446
1
原创 在vue中引入内部css文件
在vue中引入内部css文件1.新建base.css文件，目录：assets/css/base.css2.在main.js中写：import './assets/css/base.css';（此时会报错，需要安装依赖）3.安装依赖npm install style-loader --save-devnpm install css-loader --sa...
2019-03-06 10:51:35
4764
1
原创 js禁止图片拖动
js禁止图片拖动 1.js for (i in document.images) document.images[i].ondragstart = imgdragstart; function imgdragstart() { return false; };
2019-01-23 11:29:11
3038
原创 js判断数组中对象是否存在某个值
js判断数组中对象是否存在某个值var arr = [{ name: "回锅肉", value: "0"}, { name: "小炒肉", value: "1"}]var result = arr.some(function(item) { if (item.name == "小炒肉") { return true; }...
2019-01-16 10:02:28
23362
原创 js调用angularjs内部方法，$scope.$apply()强制更新
js调用angularjs内部方法，$scope.$apply()强制更新1.html<div id="food" ng-cloak ng-app="food" ng-controller="FoodCtrl"> <button type="button" onclick="isShow()">点击</button&
2019-01-15 13:37:13
2658
原创 angularjs和vue.js实际运用对比
1.angularjs和vue.js在初始化防止代码闪烁的指令1.1.angularjs在页面最外层div写上v-cloak，并且增加一个class——“ng-cloak”<div class="ng-cloak" ng-cloak ng-app="app" ng-controller="AppCtrl"></div>.ng-cloak { ...
2019-01-14 16:23:14
1177
原创 在ng-repeat 中使用 ng-click不起作用
在ng-repeat 中使用 ng-click不起作用 在angular 中使用 ng-repeat 过程中,有时需要绑定click事件 ,这时候会想到使用ng-click ,但是并没有效果；此时应该使用 data-ng-click 替代 ng-click ,并且绑定的时候也不需要 {{}}.比如：<div ng-repeat="item in tabbar...
2019-01-14 13:21:22
2174
原创 js数组求和的方法
js数组求和的方法var array = [1, 2, 3, 4, 5];var sum = 0;1.for循环 for (let i = 0; i < array.length; i++) { sum += array[i]; }2.forEach array.forEach(ele => { sum ...
2018-12-25 15:15:31
42651
原创 js数组排序
js数组排序 var values = [5, 10, 0, 15, 1, 20]; console.log(values.sort()); //[0, 1, 10, 15, 20, 5] //sort()方法根据测试字符串的结果改变原来的顺序。 //因为数值 5 虽然小于 10，但在进行字符串比较时， "10"则位于"5"的前面，于是数组的顺序...
2018-12-21 13:58:53
928
原创 根据数组中对象的某一属性排序
根据数组中对象的某一属性排序var newArray = [{ name: "aaa", value: 0},{ name: "ddd", value: 3},{ name: "bbb", value: 1},{ name: "eee", value: 4},{ name: "ccc", valu...
2018-12-19 17:53:14
774
原创 移动端图片上传:localResizeIMG先压缩再ajax上传
移动端图片上传:localResizeIMG先压缩再ajax上传 下载https://github.com/think2011/localResizeIMG/archive/4.9.35.zip，之后引入以下几个js文件以及jquery.js1.html<div class="feedback"> <div class="mui-col-xs-12 mui...
2018-12-17 17:04:13
304
textarea.zip
2020-04-29
iframe+postMessage实现跨域通信
2019-08-22
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人