- 博客(43)
- 问答 (43)
- 收藏
- 关注
RSS订阅原创 ES6切换图片项目完整点击切换逻辑
Img.prototype._bind = function() { methods.$('.__Img__classify' , this.wrap).addEventListener('click',({target}) =>{ if(target.nodeName !== 'LI') return; const type = targ...
2020-03-30 07:09:41
305
原创 项目：通过ES6实现图片切换里的通过分类获取图片的方法
//根据分类获取图片 Img.prototype._getImgsByType = function (type) { return type === '全部' ? [...this.all] : this.classified[type].map(index => this.all[index]) //如果不是，就从ALL里面取出所有相应type的图片 }...
2020-03-29 06:10:28
279
转载 JS语法之：map()方法
https://blog.youkuaiyun.com/liminwang0311/article/details/86480829
2020-03-18 04:39:18
255
原创 ES6版本get，set实现实例
class AudioPlayer{ constructor(val){ this._status = 0 if(val == undefined){ this.status = 0 }else{ this.status = val } this.init() } init() { const au...
2020-02-18 12:12:16
883
转载 原生JS获取HTML元素的八种方法
https://blog.youkuaiyun.com/china_dou/article/details/83154800
2020-02-18 10:56:34
404
原创 ES6类的定义和自执行类
//类表达式const Person = class P { constructor(){ console.log(P) P.a = 1 }}new Person()const A = new class C{ constructor(){ console.log('我是自执行类') }}()上面给定义的类一个自己的名字主要是方便万一以后...
2020-02-12 06:37:57
333
原创 queryselector和queryselectorall的区别
Msg.prototype._show = function(el,overlay) { document.body.append(el); document.body.append(overlay); setTimeout(function() { el.style.transform = 'translate(-50%, -50%) scale(1, ...
2020-02-11 05:39:11
657
原创 使用promise.all来实现所有图片都加载完成后才一起出现的效果
const loadImg = (src) => { return new Promise((resolve, reject) => { const img = new Image() img.src = src img.onload = ()=>{ resolve(img) ...
2020-02-10 04:20:37
1538
原创 promise.all和promise.race
function getData1(){ return new Promise((resolve, reject) => { setTimeout(()=>{ console.log('第1条数据加载成功') resolve('data1') },1000) }) }function getData...
2020-02-08 16:33:55
133
原创 promise函数常用配合对象以及状态的区分
function f(val) { return new Promise((resolve, reject) => { if(val){ resolve({name: '小明'}) } else{ reject('404') } }) }f(false).then((data) ...
2020-02-08 05:35:53
146
原创 promise使用实例
//这是旧版回调写法// function moveTo(el,x,y,cb){// el.style.transform = `translate(${x}px,${y}px)`// setTimeout(function(){// cb && cb()// },1000)// }// let el = document.q...
2020-02-08 04:47:00
155
原创 html调用带参数的自执行js的方法
JS部分// 初始化一个弹出框// 生成dom元素// 插到页面中// 显示(function(window, document) { let Msg = function(options) { this._init(options); } Msg.prototype._init = function({ content = '' }) { this.co...
2020-02-03 15:11:29
1169
原创 解构赋值获取字符串长度，注意const后面跟着的是花括号
const str = 'i am the stone bone'const [a,b,c,...oth] = strconsole.log("TCL: a,b,c,...oth", a,b,c,...oth) //一个是一个字符const {length,split} = str
2020-02-03 05:16:47
907
1
原创 解构赋值的函数的乱序传参和乱序接收返回值
function AJAX({ url, data, type = 'get'}){ console.log("TCL: AJAX", AJAX) //解构乱序传参}AJAX({ url: '/getinfo', data: { a: 1 },})function getUserInfo(uid) { // ...ajax return { s...
2020-02-03 05:16:22
181
原创 千万注意解构赋值强调顺序而不是包含，还有const常量解构赋值时出现重名的解决方法
const player = { nickname: '感情的戏∫我没演技∆', master: '东海龙王', skill: [{ skillName: '龙吟', mp: '100', time: 6000 },{ skillName: '龙卷雨击', mp: '400', time: 3000 },{ skillName: '龙腾', mp: '90...
2020-02-03 01:10:37
354
原创 运用解构赋值得到函数返回的多个参数
function getUserInfo(id){ return [ true, { name:'xiaoming', sex:'male', age:'18', id:id }, '请求成功' ]}const [sta...
2020-02-03 00:42:12
434
原创 自己定义一个freeze方法
//我们自己定义的freeze方法Object.defineProperty(Object,'freezePolyFill'),{ value: function(obj){ var i for(i in obj){ if(obj.hasOwnProperty(i)){ Object.defineP...
2020-02-02 01:20:41
270
原创 微信小程序标准切换状态
onLoad: function (options) { var postId = options.id console.log("文章ID",postId) this.data.currentPostId = postId var postData = postsData.postList[postId] this.setData({postData})...
2020-02-01 04:29:03
254
原创 微信小程序wx:id和wx:else
<view class="circle-img"> <image wx:if="{{collected}}" bindtap="onCollectionTap" src="/images/icon/collection.png"></image> <image wx:else bindtap="onCollectionTap" s...
2020-01-31 23:30:38
526
原创 微信小程序通过文章不同的id去往不同的页面
onPostTap: function(e){ var postId = e.currentTarget.dataset.postid; wx.navigateTo({ url: 'post-detail/post-detail?id='+postId, }) },注意navigateto的写法，这是标准的分离ID的写法，至于上面的id，来自于我们在w...
2020-01-29 05:41:03
768
原创 微信小程序模板里使用扩展运算符
<template name="PostItem"> <view class="post-container"> <view class="post-author-date"> <image class="post-author" src="{{item.headImgSrc}}"></image> ...
2020-01-28 14:32:55
724
原创 小程序，双向数据绑定的要点
<block wx:for="{{post_key}}" wx:for-item="item"> <view class="post-container"> <view class="post-author-date"> <image class="post-author" src="{{item.headImgSrc...
2020-01-27 23:39:49
208
原创 美团项目计算图表上的红色小字
function changeDot(){ var $counts = $strTop.find('.count'); var total = 0; for(let i = 0 ; i < $counts.length; i++){ total += parseInt($($counts[i]).text()); } if (total>0){ $...
2020-01-13 03:05:24
222
原创 美团项目数据传导，关于用点击事件给json添加项目
(function(doc, win){//顶部模板字符串 var itemTopTmpl = `<div class="choose-content"> <div class="content-top"> <div class="clear-car">清空购物车</...
2020-01-07 02:30:33
155
原创 （极重要）在jquery中给jquery对象挂载数据以及不同js间的调用和传值
//这里因为外面穿入了data，我们就不自己get了function getList(data){ var list =data; initRightList(list);}//渲染列表 parma arrayfunction initRightList(list){ $('.right-list-inner').html(''); list.forEach((it...
2020-01-01 17:42:42
629
原创 jquery美团项目绑定点击事件
//左侧模板类目 var itemTmpl = `<div class="menu-item"> <img class="img" src="$picture" /> <div class="menu-item-right"> <...
2020-01-01 17:29:12
140
原创 CSS中自带的改善滑动的方法，以及弹性布局中的一种比较少见的居中方法
.menu-inner .left-bar{ width: 85px; background-color: #efefef; overflow: auto; height: 100%; -webkit-overflow-scrolling: touch;}.menu-inner .item-text{ line-height: 1.6rem; align-self...
2019-12-26 01:02:14
165
原创 vertical-align来调整同一父元素下子元素的垂直对齐，用他的具体数据值
vertival-align一般和display：inline-block配合，来调整同一父元素下子元素的垂直对齐.menu-inner .item-icon{ width: .533333rem; height: .533333rem; display: inline-block; margin-right: .16rem; vertical-align: -0.10666...
2019-12-25 22:02:15
250
原创 利用css来做伪类居中的方法
.tab-bar .tab-item{ flex: 1; height: 1.2rem; line-height: 1.2rem; position: relative; color: #666; text-align: center; text-decoration: none;}.tab-bar .tab-item.active::after{ conten...
2019-12-25 02:33:06
1438
1
原创 使用伪类快速定位一个图标
.items li{ height: 1.2rem; font-size: .373333rem; position: relative; padding-left: .693333rem; margin-left: .4rem; border-bottom: .026667rem solid #e4e4e4; line-height: 1.2rem;}.items...
2019-12-24 03:55:06
288
原创 replace方法里简单的全局替换
var itemTmpl = `<a class="$key btn-item" href="../$key/$key.html"> <div class="tab-icon"></div> <div class="btn-name">$text</div> ...
2019-12-24 01:36:50
895
原创 关于replace方法改变模板字符串数据时的数据传递问题
// @param string 获取数据function getList(){ $.get("../../json/orders.json", function (data, textStatus, jqXHR) { console.log("我是订单数据组",data); var list = data.data.digestlist || []; ...
2019-12-23 03:36:49
293
原创 meituan项目里的渲染星级的方法，json里是一个浮点数
我们在模块js里写好逻辑之后通过window方法发射出来，在上级js里通过new的形式让系统自己去找到发射出来的方法，下面的this.score和 _getStars方法里的this.score是一样的，下面的方法同理，这个this.score的score来自被调用的时候所用的参数，也就是json里的wm_poi_score var itemTmpl = `<div class="sta...
2019-12-22 22:27:31
177
原创 占位符后面一定不能紧跟标签截止符
'<img class="item-img" src=$pic_url />'这样是对的'<img class="item-img" src=$pic_url/>'如果这样写的话这个/会被记录到网址里，谨记
2019-12-21 17:43:15
109
原创 父元素如果子元素都进行了浮动的话，父元素需要清除浮动，否则父元素高度会有问题
.clearfix:before,.clearfix:after{ content: " "; display: inline-block; height: 0; clear: both; visibility: hidden;}
2019-12-21 16:20:37
980
原创 单行文字溢出后省略的轮子
.one-line{ overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
2019-12-21 03:10:39
70
原创 jq和js实现滚动加载
首先纪律性的定义page和isLoadingvar page = 0;var isLoading = false;// 获取商家列表function getList(){ page++; isLoading = true; $.getJSON("../json/homelist.json", (data, textStatus, jqXHR) => { ...
2019-12-21 02:46:04
115
原创 利用pathname来定位被激活的模块
//根据url来确定key值 var arr = window.location.pathname.split('/'); console.log('我是以/为分隔的pathname',arr); var page = arr[arr.length-1].replace('.html',''); //给key值对应的模块加上active console.lo...
2019-12-21 01:55:48
186
空空如也
关于ES6解构赋值我有不理解的地方
2020-03-29
求教在我这个教学实例里ES6写法函数和以前写法的结果为何会不同
2020-02-12
萌新求教mdn里提供的web接口参考页面，上下两种接口有啥不同
2020-02-12
萌新求教JS新建对象的方法有哪些
2020-02-11
请教关于看不懂vscode给出的方法解构解析的问题
2020-02-10
vscode对一些js方法不提示
2020-02-04
求解关于js拷贝的问题
2020-01-07
请问vscode编写js的时候 模板字符串里面能有代码提示吗？就是` `里面
2019-12-23
请问如何刷新http-server里的文件
2019-12-15
跟着前端老师做的软件卡在了很奇怪的地方，无法找到.json文件，又不报错
2019-12-15
为什么我本地明明已经更改了文件，http-server里的却仍然不变
2019-12-03
vscode代码提示不全的问题
2019-12-03
请问电脑内存明明很大为什么任务管理器提示一下就满了
2019-11-14
关于html网页跳转的问题
2019-10-31
跟着学习vue和npm时对命令的理解出现了问题，求大神解答
2019-10-26
请教一下关于建站管理后台的问题
2019-10-22
Vue里面用v-bind绑定一个src，里面能否用相对路径呢
2019-10-18
登陆优酷的时候出现了我难以理解的错误
2019-10-01
浏览器打开网页的时候样式不全，求教解答方法
2019-09-30
某些网站样式文件无法加载出来，求大神解答
2019-09-30
萌新求教Vue组件里的:和@有什么作用
2019-09-29
在公司能启动的项目回家就启动不了了。。。
2019-08-11
项目里使用echart作图，可以做出曲线但是却一直无法实现面积图效果
2019-08-06
我把echarts里的漏斗图实例放到项目里发现少了些特性
2019-08-02
求教如何用echart做出如图所示的图表
2019-08-01
求教关于sublime插件的问题
2019-07-30
sublime里查看项目见到了一个正常使用的属性，却无法全局搜索到它定义的地方
2019-07-26
sublime text3全局搜索出来一堆乱码
2019-07-23
npm安装http-server后启动，无法进入给出的网页，提示网页发送的响应无效
2019-07-23
npm安装http-server之后不断的提示http-server不是内部或外部命令
2019-07-23
:after伪类不显示，请问是为什么
2019-07-22
前端项目如何让每个新打开的窗口之间互不影响
2019-07-19
求解关于html input标签中利用pattern属性和正则表达式没用的问题
2019-05-11
请问notepad++有什么能够查看css和html5语法错误的插件吗
2019-05-07
html5中的[]属性选择器有办法相互叠加吗
2019-05-06
mysql数据库语法问题，关于计算一张表内多个列值列的分别的总数，并依次输出
2019-05-05
关于前端CSS和html5中有几个找不到的属性的问题
2019-05-02
求教如何用echart取出dao层中的数据，还有特殊的sql语句写法
2019-04-08
Echarts如何使用java类里面的数据
2019-04-04
请问如何测试手里的demo用例啊
2019-04-03
TA创建的收藏夹 TA关注的收藏夹
TA关注的人