- 博客(57)
- 资源 (1)
- 收藏
- 关注
RSS订阅原创 2020-09-19 html的页面禁止微信中的分享 + css的flex实现一行宽度平均分配 + JS的对象转换为数字类型 + 软技能的预估工作量
2020-09-19 题目来源：http://www.h-camel.com/index.html[html] H5页面在微信中如何禁止分享给好友和朋友圈？<script> function onBridgeReady() { WeixinJSBridge.call('hideOptionMenu'); } if (typeof WeixinJSBridge == "undefined") { if (document.addEv
2020-09-29 09:10:08
178
原创 2020-09-18 html的打印网页换页 + css的height100%如何生效 + JS的暂存死区 + 软技能的屏幕坐标、客户区域坐标、页面坐标
2020-09-18 题目来源：http://www.h-camel.com/index.html[html] 打印网页时，如何让指定的元素另起一页打印呢// footer 元素后始终插入分页符@media print { footer {page-break-after: always;}}// h1 标题之前 始终插入分页符@media print { h1 {page-break-before: always;}}// 避免在pre blockquote 中使
2020-09-28 10:09:42
280
原创 2020-09-17 html的列表编号倒序 + css的2个inlineblock之间的空隙 + JS的requestIdleCallback + 软技能的周日报的excel的模板
2020-09-17 题目来源：http://www.h-camel.com/index.html[html] 举例说明只用html和css如何使得一个列表编号倒序？方法一： reversed<ol reversed> <li>C</li> <li>B</li> <li>A</li></ol>方法二： li 中的 value 值<ol> <li v
2020-09-28 09:08:33
169
原创 2020-09-16 html的http状态码 + css的spacebetween + JS的EventLoop的缺点 + 软技能的管理日常化
2020-09-16 题目来源：http://www.h-camel.com/index.html[html] http中的301、302、307、308有什么区别100 继续，客户端应继续请求101 切换协议，server根据client，只能切换到更高的协议200 OK 请求成功201 已创建202 已接受203 非授权信息301 永久移动，请求的资源以被永久移动到新的URI，今后的任何新请求都应使用新的URI代替302 临时移动，资源被临时移动，客户端应继续使用原有
2020-09-27 11:08:06
148
原创 2020-09-15 html的input标签添加清除按钮 + css的清除li标签的默认斜体 + JS的requestIdleCallback + 软技能的模块热替换
2020-09-15 题目来源：http://www.h-camel.com/index.html[html] 如何给input的右上角加个清除的按钮？input右边加个图标，设置它的点击事件，click 去清除input标签的val值$("#clear").click(function () { $(".input_key").val(""); $(".input_key").focus(); // $(this).hide(); // 可以设置iput的获得焦点事件
2020-09-27 08:59:36
180
原创 2020-09-14 html的光标聚焦第一input + css的fixed与float区别 + JS的requestAnimationFrame + 软技能前端如何监控性能
2020-09-14 题目来源：http://www.h-camel.com/index.html[html] 进入编辑页面时，如何把光标聚焦到第一个input？首先来看看如何为input设置光标聚集<input type="text" autofocus>那多个input如何处理呢：let arr = document.querySelectorAll("input");//arr[0].autofocus = "true";arr[0].setAttribute(".
2020-09-25 10:56:03
413
原创 2020-09-13 html的span的标签嵌套 + css的position fixed定位的基准元素改变的方式 + JS的UI渲染之前处理一些事情你该怎么办 + 软技能的时间
2020-09-13 题目来源：http://www.h-camel.com/index.html[html] html中在span标签里面可以放那些标签？元素开始与结束标签嵌套错误，页面可以在大部分浏览器被正常解析，IE9会出现解析错误在<p>元素内嵌入<div>等元素造成所有浏览器的解析错误吗，亲测可以在<h1>~<h6>元素内嵌入<div>等元素所有浏览器可以解析正常在<a>元素内嵌入<a>元素会
2020-09-25 09:51:42
265
原创 2020-09-12 html的两个数组的交集 + css的flex脱离viewport会产生什么bug + JS的请求的缓存处理 + 软技能的组织内部矛盾处理
2020-09-12 题目来源：http://www.h-camel.com/index.html[html] const nums1 = [1, 2, 2, 1], nums2 = [2] 交集是什么？// map方法求两个数组的交集//使用Map，数组作为键值key，计数器作为valuepublic int[] intersect2(int[] nums1, int[] nums2) { Map<Integer,Integer> map = new HashMap<
2020-09-25 09:07:56
75
原创 2020-09-11 html的video的触发顺序 + css的是stacking context + JS的DOM节点的操作如何优化 + 软技能的业务与技术冲突时
2020-09-11 题目来源：http://www.h-camel.com/index.html[html] H5中video的事件的触发顺序是怎样的？onloadstart ondurationchange onloadedmetadata onloadeddata onprogress oncanplay 用户可以开始播放视频/音频时触发 oncanplaythrough[css] 如何创建stacking context？stacking context 层叠上下文...
2020-09-24 10:57:56
768
原创 层叠上下文 stacking context 示例
<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>层叠上下文</title> <script src="js/jquery-3.4.1.min.js"></script> <style> body { background-color: white; .
2020-09-24 10:34:09
92
原创 2020-09-10 html的MediaRecorder应用场景 + css的分离图层做动画 + JS的RAIL性能评估模型 + 软技能的管理团队人重要还是事重要
2020-09-10 题目来源：http://www.h-camel.com/index.html[html] 你有使用过MediaRecorder吗？说说它的运用场景有哪些？MediaRecorder() 构造函数会创建一个对指定的 MediaStream 进行录制的 MediaRecorder 对象。对指定的流创建一个音频比特率为128kbps,视频比特率为2.5Mbps的媒体录制器. 被录制的媒体数据会以MP4格式封装。var options = { audioBitsPerSe
2020-09-24 08:56:23
268
原创 2020-09-09 html的sharedworker应用场景 + css的动画代替js动画有什么好处 + JS的寄生式组合继承 + 软技能的空降管理团队
2020-09-09 题目来源：http://www.h-camel.com/index.html[html] 说说你对H5的SharedWorker的理解，它有什么运用场景？Worker SharedWorker 是HTML5为我们提供的多线程的实现机制。解决问题： 如果js花费较长时间来处理一件事，那么浏览器这段时间将不会对用户产生响应。看看这个主线程调用多个子线程的例子：主线程要完成一个任务需要两个线程，它创建了两个线程worker1,2,先向worker1请求，得到返回的数据后，再请求w
2020-09-23 09:32:34
151
原创 2020-09-08 html的sharedworker应用场景 + css的同级li的最后一个li的右边距 + JS的sdk设计 + 软技能的团队管理核心要素
2020-09-08 题目来源：http://www.h-camel.com/index.html[html] 说说你对H5的SharedWorker的理解，它有什么运用场景？Worker SharedWorker 是HTML5为我们提供的多线程的实现机制。解决问题： 如果js花费较长时间来处理一件事，那么浏览器这段时间将不会对用户产生响应。看看这个主线程调用多个子线程的例子：主线程要完成一个任务需要两个线程，它创建了两个线程worker1,2,先向worker1请求，得到返回的数据后，再请求w
2020-09-23 09:13:12
170
原创 2020-09-07 html的head的必有标签 + css的单位 + JS的sdk设计 + 软技能的团队管理
2020-09-07 题目来源：http://www.h-camel.com/index.html[html] 在head标签中必不可少的是什么？head标签中主要包括，标题、编码格式、引入的css和js，还有很多meta标签中所定义的部分。主要包含的内容参考：<head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user
2020-09-22 16:57:13
197
原创 vue项目调试时控制台报错 sockjs-node/info?t=1600762121688 net::ERR_NETWORK_CHANGED
找了一下原因：sockjs-node是一个JavaScript库，提供跨浏览器JavaScript的API，创建了一个低延迟、全双工的浏览器和web服务器之间通信通道。在项目运行以后，network会一直调用这个接口。如果没有使用，那么就一直会报这个异常。那我们来点进去看一下这个js如何解决这个问题， 找到 node_modules/sockjs-client/dist/sockjs.js这个文件， 把上图中标记的1606行注释。...
2020-09-22 16:18:02
1825
1
原创 2020-09-06 html的大数据列表优化 + css的flex + JS的SeaJS与requireJS库 + 软技能的技术管理
2020-09-06 题目来源：http://www.h-camel.com/index.html[html] 如何优化大数据列表（10万+）的性能？说说你的方案1.列表中固定只显示少量的数据，比如60条2.在列表滚动的时候不断的去插入删除dom3.startIndex、endIndex，不断的改变这个值来获取最新的显示列表4.paddingTop、paddingBottom撑开容器的滚动区域转自 https://www.cnblogs.com/songbw/p/11613869.h
2020-09-22 09:26:11
96
原创 2020-09-05 html的获取所有img标签的src地址 + css的flex 1的完整写法 + JS的非行间样式获取 + 软技能的平衡点
2020-09-03 题目来源：http://www.h-camel.com/index.html[html] 请写一个正则获取html源码中所有img标签的src地址/// <summary>/// 取得HTML中所有图片的 URL。/// </summary>/// <param name="sHtmlText">HTML代码</param>/// <returns>图片的URL列表</returns>publi
2020-09-22 09:00:02
204
原创 解决vue-router进行路由导航时，浏览器地址栏中的 #
修改index.js中所实例化的router，举个栗子import Vue from 'vue'import VueRouter from 'vue-router'constroutes=[{path:'/',redirect:'/login'},{path:'/login',name:'Login',component:Login}]const router = new VueRouter({/* vue...
2020-09-21 15:31:01
616
原创 2020-09-04 html的纯htm实现跑马灯效果 + css的弹幕效果 + JS的实现对节点的拖拽 + 软技能的web端的批量打印
2020-09-03 题目来源：http://www.h-camel.com/index.html[html] 如何使用纯HTML实现跑马灯的效果？应该是纯css实现的吧，css的动画属性animation:动作名称 动画时间 速度曲线 延时 播放次数animation: traffic-light 5s linear 0s infinite;[css] 使用css使用一个弹幕的效果结合动画特性 animation 对div的位置进行修改 tansform: translateX();
2020-09-21 10:35:36
293
原创 JS实现对节点的拖拽
转自他人博客，忘记地址了 ^_^<!DOCTYPE html><html><head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=Edge"> <title>js实现对节点拖拽</title> <style type="text/css"> * { .
2020-09-21 10:22:52
311
原创 CSS实现的弹幕效果
<!DOCTYPEhtml><html><head><metacharset="utf-8"><title>CSS实现的弹幕效果</title><scriptsrc="js/jquery-3.4.1.min.js"></script><style>body{background-col...
2020-09-21 09:38:11
741
原创 2020-09-03 html的网站快速下载模板 + css的grid布局与flex布局 + JS的代理console.log方法 + 软技能的android键盘回落后留白
2020-09-03 题目来源：http://www.h-camel.com/index.html[html] 给你一个参考网站，你能快速下载它的模板吗？用哪些方法？浏览器的查看网页源代码，但是这样只能给你个结构排版参考，真正的框架需要自己研究。建议去模板网站找个类似的demo下载进行修改。[css] grid布局和flex布局有什么区别？flex用于一维布局，grid用于二维布局。1.flex 子元素本身来决定放置方式，只需要设置父级元素 display: flex; 使元素居右自
2020-09-18 10:25:41
129
原创 2020-09-02 html的RGB与CMYK + css的grid布局 + JS的输入类型选择器返回DOM元素 + 软技能的http3
2020-09-02 题目来源：http://www.h-camel.com/index.html[html] HTML采用的是RGB颜色还是CMYK颜色？为什么？RGB色彩模式，红绿蓝三原色。 网页设计常用CMYK也成为印刷色彩模式，一种依靠反光的色彩模式，需要外界光源才能看到，常用印刷打印场景[css] 你有使用过grid布局吗？说说你对它的理解使用Grid布局非常简单，你只需要给容器（container）定义：display:grid，并设置列（grid-template-colu
2020-09-18 09:43:55
248
原创 2020-09-01 html的列表元素的兄弟元素为div + css的鼠标悬停图片放大 + JS的class与普通构造函数区别 + 软技能的V8引擎
2020-08-31 题目来源：http://www.h-camel.com/index.html[html] 如果列表元素li的兄弟元素为div，会产生什么情况？元素开始与结束标签嵌套错误，页面可以在大部分浏览器被正常解析，IE9会出现解析错误在<p>元素内嵌入<div>等元素造成所有浏览器的解析错误在<h1>~<h6>元素内嵌入<div>等元素所有浏览器可以解析正常在<a>元素内嵌入<a>元素会导致
2020-09-17 09:51:15
121
原创 2020-08-31 html的标签嵌套的闭合错误 + css的吊扇旋转动画 + JS的Math的最大最小值 + 软技能的webAssembly
2020-08-31 题目来源：http://www.h-camel.com/index.html[html] html的开始与结束标签嵌套错误会导致哪些问题？元素开始与结束标签嵌套错误，页面可以在大部分浏览器被正常解析，IE9会出现解析错误在<p>元素内嵌入<div>等元素造成所有浏览器的解析错误在<h1>~<h6>元素内嵌入<div>等元素所有浏览器可以解析正常在<a>元素内嵌入<a>元素会导致所有
2020-09-17 09:32:37
292
1
原创 旋转的五角星
<!DOCTYPE html><html><head> <meta charset="utf-8"> <script src="js/jquery-3.4.1.min.js"></script> <style> body { background-color: white; background-image: .
2020-09-17 09:23:08
474
原创 2020-08-30 html的密码的明暗文切换 + css的小车行驶动画 + JS的改变作用域链 + 软技能的websocket实现握手
2020-08-30 题目来源：http://www.h-camel.com/index.html[html] 写一个密码默认星号，但可以查看密码的输入框主要就是改变input标签中的type属性，利用jquery来实现一个比较low的demo：<button id="btn" onmousedown="changeText()" onmouseup="changePwd()">按钮</button><br /><form> <i
2020-09-17 08:47:00
266
1
原创 2020-08-29 html的不规则形状实现方式 + css的发光霓虹灯位子效果 + JS的各种数组 + 软技能的覆盖率
2020-08-29 题目来源：http://www.h-camel.com/index.html[html] 制作一个不规则形状有哪些方法可以实现？各种形状的实现，border-top border-right border-bottom border-lefthttps://www.cnblogs.com/liangxiaofeng/p/5936760.html[css] 使用css实现闪光的霓虹灯文字效果css实现的文字效果https://blog.csdn.net/w1781
2020-09-14 15:10:41
152
原创 2020-08-28 html的跨域通信方式 + css的元素属性赋值过程 + JS的undefined与not defined + 软技能的持续集成
2020-08-27 题目来源：http://www.h-camel.com/index.html[html] 跨域通信有哪些方式？JSONPAjaxWebSocketCORSHashpostMessage各个技术介绍 https://www.cnblogs.com/qianguyihao/p/8523576.html[css] 说说CSS对元素属性赋值的详细过程？深入CSS的属性赋值https://blog.csdn.net/weixin_33712881/ar
2020-09-14 14:42:34
137
原创 2020-08-27 html的cookie + css的雪花效果 + JS的数字占内存多少byte + 软技能的人脸识别
2020-08-27 题目来源：http://www.h-camel.com/index.html[html] 说下cookie的优点和使用场景是什么？cookie采用的是在客户端保持状态的方案，而session是在服务端保持状态的方案。应用场景： cookie实现自动登录； 根据用户爱好定制站点；用户访问计数；这是一篇非常全面的文章 https://blog.csdn.net/u011145904/article/details/77745777[css] 使用css3制作雪花效果
2020-09-14 14:20:14
107
原创 2020-08-26 html的预解析dns + css的特性 + JS的全局函数 + 软技能的成长性
2020-08-26 题目来源：http://www.h-camel.com/index.html[html] html哪个标签属性可以通过预解析DNS？DNS prefetching<link rel=”dns-prefetch” href=”//weibo.com”>[css] 你最不喜欢css的哪些特性是什么？为什么？打印属性[js] 列举出JS的全局函数1.decodeURI() 解码某个编码的URI2.decodeURIComponent 解码一个编码的
2020-09-14 13:55:55
192
原创 2020-08-25 html的页面优化渲染过程 + css的无法实现的样式 + JS的四则混合运算求值 + 软技能的同步异步区别及应用场景
2020-08-25 题目来源：http://www.h-camel.com/index.html[html] 如何优化页面的渲染过程首先，页面的渲染过程包括以下几个步骤：1.HTML解析，构建DOM树2.CSS解析，构建CSSOM树3.DOM和CSSOM结合，形成Rendering Tree渲染树4.根据渲染树来进行布局，计算节点的信息5.将各个节点绘制到屏幕上注意：DOM和CSSOM如果被修改了，将会进行重排和重绘优化：1.HTML的结构布局完整清晰，标签的合理使
2020-09-14 11:57:08
110
原创 2020-08-24 html的预渲染标签 + css的忘记处理 + JS的如何创建private方法 + 软技能的web缓存需要后台如何配合
2020-08-24 题目来源：http://www.h-camel.com/index.html[html] html的哪个标签可以预加载？通过浏览器特性来提高资源加载速度的方法：1.DNS prefetching DNS解析的速度可以通过下面的标签进行预解析<link rel=”dns-prefetch” href=”//weibo.com”>2.Preconnect 和DNS预解析差不多，preconnect还会做TCP握手和TLS Negotiation<l
2020-09-11 08:58:02
150
原创 2020-08-23 html的标签预加载 + css的新知识 + JS的json的标准格式 + 软技能的能说会道vs安静做事
2020-08-23 题目来源：http://www.h-camel.com/index.html[html] html的哪个标签可以预加载？通过浏览器特性来提高资源加载速度的方法：1.DNS prefetching DNS解析的速度可以通过下面的标签进行预解析<link rel=”dns-prefetch” href=”//weibo.com”>2.Preconnect 和DNS预解析差不多，preconnect还会做TCP握手和TLS Negotiation<l
2020-09-11 08:46:49
180
原创 2020-08-22 html的a标签防止跳转 + css的高级特性 + JS的判断字符串结尾的字母 + 软技能的功能上线后的报告发布
2020-08-22 题目来源：http://www.h-camel.com/index.html[html] 在a标签中，怎样防止链接跳转？一般使用a标签来做按钮时，不需要跳转时，href的值为空。如果不需要跳转，需要设置href的值：<a href="javascript:void(0);">链接</a>[css] 你觉得css高级的特性有哪些？transform: translate();box-shadowanimationtext-shad.
2020-09-11 08:17:24
112
原创 2020-08-21 html的a标签href为空 + css的学习方法 + JS的实现树的路径查询 + 软技能的端到端交付的理解
2020-08-21 题目来源：http://www.h-camel.com/index.html[html] 说说如果a链接href=""（空）时点击时会有什么表现？表现就是：刷新页面一般使用a标签来做按钮时，不需要跳转时，href的值为空。如果不需要跳转，需要设置href的值：<a href="javascript:void(0);">链接</a>[css] 你是怎么学习css的？说说你的学习方法多看多写[js] 写一个方法，实现树的路径查询[代码].
2020-09-10 16:20:20
339
原创 2020-08-20 html的canvas的坑 + css的最喜爱特性 + JS的函数实现 + 软技能的https的数据传输安全
2020-08-20 题目来源：http://www.h-camel.com/index.html[html] 使用canvas时你有遇到过哪些坑？是如何解决的？坑之一：输入的文字和坐标都是标准的，但是文字就是不给你在标准展示，坐上偏上。原因：canvas插入文字的坐标（x，y）, 不是左上角相对于画布的坐标，是左下角相对于画布的坐标（1）x:文字左边相对于画布的坐标（2）y:文字下面相对于画布的坐标，但是，这个y有个baseline的限制，如果需要严格的上下居中时，需要设置一下它的 b
2020-09-10 09:15:47
163
原创 2020-08-19 html的ios下webapp全屏 + css的代码 + JS的N个数放到M个位置上有多少种排列 + 软技能的本地开发如何绑定域名开发
2020-08-19 题目来源：http://www.h-camel.com/index.html[html] 如何在IOS下启用WebApp全屏模式？当网站添加到主屏幕后再点击进行启动时，可隐藏地址栏（从浏览器跳转或输入链接进入并没有此效果）<meta name="apple-mobile-web-app-capable" content="yes" /> /* 删除苹果默认的工具栏和菜单栏 */<meta name="apple-touch-fullscreen" co
2020-09-10 08:57:07
249
原创 2020-08-18 html的最喜爱标签 + css的下雨动画 + JS的取消promise + 软技能的扫码登录原理及流程
2020-08-17 题目来源：http://www.h-camel.com/index.html[html] 你最喜欢html的哪个标签？为什么？meta[css] 使用css3制作下雨动画的效果线性渐变、阴影、缩放来实现下雨动画https://www.imooc.com/article/279422[js] 如何取消promise1.rejectfunction hello() { let _res, _rej: any; const promise = ne
2020-09-09 15:54:13
107
原创 2020-08-17 html的data-属性 + css的不可替换元素 + JS的多文件上传组件 + 软技能的第三方网站监测本机用户是否开启某个应用
2020-08-17 题目来源：http://www.h-camel.com/index.html[html] 举例说明使用data-有什么优点？1.可替换元素：置换元素 是指标签会被代替。 包括 img object video textarea input，某些元素在特定情况下可替换，audio canvas专业定义：一个内容不受CSS视觉格式化模型控制，CSS渲染模型并不考虑对此内容的渲染，且元素本身一般拥有固有尺寸（宽度，高度，宽高比）的元素，被称之为置换元素。2.不可替换元素：非置
2020-09-09 15:08:51
105
springboot工程实例代码
2019-11-06
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人