目录
1.和前端有哪些接触?2b还是2c?之前有系统学习过前端吗?
10.了解setInterval吗?和setTimeout的区别?
12.了解promise的哪些方法?promise.all是干嘛的?了解promise的链式调用吗?
13. 算法题:[1, [2, [ [3, 4], 5], 6]] => [1, 2, 3, 4, 5, 6]
17.智力题:如何判断一个点在不在圆内;如何判断一个点在不在三角形内?
1.和前端有哪些接触?2b还是2c?之前有系统学习过前端吗?
2.输入url到页面展示的过程?
见我的另一篇文章https://blog.csdn.net/weixin_45440502/article/details/109586398
第3点
3.缓存的方法?
见我的另一篇文章https://blog.csdn.net/weixin_45440502/article/details/109586398
第3点
4.用过样式自适应?对flex了解有多少?
见我的另一篇文章https://blog.csdn.net/weixin_45440502/article/details/109729016
第5点
5.项目里样式居中怎么做?
见我的另一篇文章https://blog.csdn.net/weixin_45440502/article/details/109729016
第4点
6.做过动画吗?
7.防误触、防重提交,怎么做?
8.输入的时候,如何实时查询?了解防抖、节流吗?
效果:一边输入关键词,搜索框下面就可以跳出搜索结果
oninput:HTML5中的标准事件,不过IE9以下的浏览器是不支持oninput事件的。仅仅在input的value值发生改变才会触发,鼠标键盘复制粘贴均可以触发,但是js修改其value值则不会触发。(chrome/safari/ff/opera/IE9+)
onpropertychange:此属性可在某些情况下解决上面存在的问题,不用考虑是否失去焦点,不管js操作还是键盘鼠标手动操作,只要HTML元素属性发生改变即可立即捕获到。onpropertychange为IE专属的
function OnInput (event) { if(event.target.value!='') { $.get("http://arrest.site:3000/search?keywords=" + event.target.value + '&limit=12', function (data) { // console.log(data) $('.it-res').html(' '); for(var i=0;i<(data.result.songs).length;i++){ $('.it-res').append('<br><span onclick="play(event)" id="'+data.result.songs[i].id +'">  -'+data.result.songs[i].name+'</span><br><br>'); } $('.search-res').show(); }); }else{ $('.search-res').hide(); } } // Internet Explorer function OnPropChanged (event) { if (event.propertyName.toLowerCase () == "value") { alert ("The new content: " + event.srcElement.value); } }
链接:https://www.jianshu.com/p/6a803ff6c4b8
函数防抖(debounce):当持续触发事件时,一定时间段内没有再触发事件,事件处理函数才会执行一次,如果设定的时间到来之前,又一次触发了事件,就重新开始延时。在事件被触发n秒后再执行回调,如果在这n秒内又被触发,则重新计时。注意了:如果n秒内又被触发,则重新计时。也就是说,他是通过“ 清空setTimeout并重新计算 ”的方式运行的。
函数节流(throttle):当持续触发事件时,保证一定时间段内只调用一次事件处理函数。节流通俗解释就比如我们水龙头放水,阀门一打开,水哗哗的往下流,秉着勤俭节约的优良传统美德,我们要把水龙头关小点,最好是如我们心意按照一定规律在某个时间间隔内一滴一滴的往下滴。如下图,持续触发scroll事件时,并不立即执行handle函数,每隔1000毫秒才会执行一次handle函数。
9.用js做一个10s倒计时的功能
setTimeout:(需要递归)
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> </head&g