你我学习网
你我博客
热衷分享技术，专注打造技术影响力的视频博客系统
-
xiaozhi
-
23.关于css margin，你需要知道的一切
原文：https://www.smashingmagazine.com/2019/07/margins-in-css/译者：前端小智为了保证的可读性，本文采用意译而非直译。当我们学习CSS时，我们大多数人学到的第一件事是CSS中盒子的各个部分的细节，这部分通过叫做 CSS盒、模型。“盒模型”中的元素之一是margin，即盒子周围的透明区域，它会将其他元素从盒子内容中推开。CSS1中描述了margi3932 人浏览
-
xiaozhi
-
7.React 新特性 Hooks 讲解及实例(四)
使用 Ref Hooks类组件中使用 Ref 一般有：String RefCallback RefCreateRef上述在函数组件中没有办法使用它们，取而代之的是useRefHooks。useRef主要有两个使用场景：获取子组件或者 DOM 节点的句柄渲染周期之间的共享数据的存储大家可能会想到 state 也可跨越渲染周期保存，但是state的赋值会触发重渲染，但是ref不会，从这点看 ref 更3932 人浏览
-
xiaozhi
-
21.JS 的5个不良编码习惯，现在就改掉吧
原文：https://dmitripavlutin.com/unlearn-javascript-bad-coding-habits/译者：前端小智为了保证的可读性，本文采用意译而非直译。想阅读更多优质文章请猛戳GitHub博客,一年百来篇优质文章等着你！在阅读JavaScript代码时，你是否有过这种感觉你几乎不明白代码的作用？代码使用了很多 JavaScript 技巧？命名和编码风格太过随意？3929 人浏览
-
web
-
html5和css3实现绚丽动画-模仿优酷视频截图功能
原文地址：http://blog.csdn.net/lmj623565791/article/details/...一般的视频网站对于用户上传的视频，在用户上传完成后，可以对播放的视频进行截图，然后作为视频的展示图。项目中也可以引入这样的功能给用户一种不错的体验，而不是让用户额外上传一张展示图。效果图：看起来还是很不错，下面我给大家分析下，极其核心代码很简单：_canvas = document.3927 人浏览
-
xiaozhi
-
8.JavaScript 是如何工作的：Service Worker 的生命周期及使用场景
你可能已经知道，渐进式Web应用程序只会越来越受欢迎，因为它们的目标是让Web应用程序用户体验更流畅，创建类似于原生应用程序的体验，而不是浏览器的外观和感觉。构建渐进式Web应用程序的主要要求之一是使其在网络和加载方面非常可靠——它应该在不确定或不存在的网络条件下可用。在这篇文章中，将深入探讨Service Workers:它们是如何工作，你应该关心什么。最后，还列出了 Service Worke3918 人浏览
-
wechat
-
微信小程序wx:for中的item什么意思以及wx:for-item的意思
wx:for="{{list}}"用来循环数组，而list即为数组名wx:for-item=“items” 即用来定义一个循环过程中每个元素的变量的如果是一维数组,按照如下方式循环出来：<view wx:for="{{list}}"> {{index}} {{item.name}} </view>以上代码中，item即为list的别名。如果是二维甚至多维数组，按照如下方3917 人浏览
-
hangge
-
K8s - 免费的Kubernetes在线实验平台介绍2（官网提供的在线系统）
kubernetes（简称K8s）是一个开源的，用于管理云平台中多个主机上的容器化的应用。 在之前的文章中，我介绍如何通过Docker为我们提供的实验网站Play with Kubernetes（PWK）来搭建Kubernetes集群（点击查看）。 但如果每次学习时都需要重新搭建一个K8s集群还是很麻烦。好在Kubernetes官网已经为我们准备好了现成的最小可用系统。我们通过Web浏览器就可3909 人浏览
-
xiaozhi
-
21.JavaScript 是如何工作的：JavaScript 的内存模型
//声明一些变量并初始化它们 vara=5 letb='xy' constc=true //分配新值 a=6 b=b+'z' c=false//类型错误:不可对常量赋值作为程序员，声明变量、初始化变量(或不初始化变量)以及稍后为它们分配新值是我们每天都要做的事情。但是当这样做的时候会发生什么呢? JavaScript 如何在内部处理这些基本功能?3909 人浏览
-
web
-
JS通过Location 对象包含有关当前 URL 的信息
Location 对象包含有关当前 URL 的信息。Location 对象是 Window 对象的一个部分，可通过 window.location 属性来访问。hash 设置或返回从井号 (#) 开始的 URL（锚）。host 设置或返回主机名和当前 URL 的端口号。hostname 设置或返回当前3903 人浏览
-
xiaozhi
-
6.Web 性能优化：Preload,Prefetch的使用及在 Chrome 中的优先级
今天，我们将深入研究Chrome 的网络栈，以明确 web 加载原语(如<link rel= preload >&<link rel= prefetch >) 背后的工作原理，以便你能够更有效地使用它们。如其他文章所述，preload是一个声明式fetch，可以强制浏览器在不阻塞document的onload事件的情况下请求资源。Prefetch告诉浏览器这个资源将3882 人浏览
-
xiaozhi
-
4.Web 性能优化：21种优化CSS和加快网站速度的方法
CSS 必须通过一个相对复杂的管道，就像 HTML 和 JavaScript一样，浏览器必须从服务器下载文件，然后进行解析并将其应用于DOM。由于优化程度极高，这个过程通常非常快——对于不基于框架的小型 web 项目，CSS通常只占总资源消耗的一小部分。框架打破了这种平衡。包括一个 JavaScript GUI 堆栈，如 jQuery UI，可以观察 CSS, JS 和 HTML大小逐渐的变大。通3880 人浏览
-
xiaozhi
-
34.JS 如何创建、读取和删除cookie
Cookie为 Web 应用程序保存用户相关信息提供了一种有用的方法。例如，当用户访问咱们的站点时，可以利用Cookie保存用户首选项或其他信息，这样，当用户下次再访问咱们的站点时，应用程序就可以检索以前保存的信息。Cookie 是什么鬼Cookie是一小段文本信息，伴随着用户请求和页面在 Web 服务器和浏览器之间传递。用户每次访问站点时，Web 应用程序都可以读取 Cookie 包含的信息。C3876 人浏览
-
xiaozhi
-
26.ES新提案：双问号操作符
本文主要讲Gabriel Isenberg撰写的ES提案“Nullish coalescing for JavaScript”。 它提出??替换||的运算符,并提供默认值。这里先把这相提案叫作双问号操作符，如果你有好的叫法，欢迎留言讨论。1.概述双问号??的操作符跟||类似，如果给定变量值为null或者undefined，刚使用双问号后的默认值，否则使用该变量值。如下:>undefined?3875 人浏览
-
web
-
input只允许上传图片类型文件
指定只允许选择图片accept="image/*"例如：<input type="file" name="file" class="element" accept="image/*">但是：这段代码在Chrome和Safari等Webkit浏览器下却出现了响应滞慢的问题，可能要等 6~10s 才能弹出文件选择对话框。简直不能忍呀。解决方法：确切指定类型例如：<input typ3873 人浏览
-
web
-
XML中常用的5个转义符
XML中常用的5个转义符:<，>，&，”，©; 的转义字符分别如下：<>&"'如表所示:字符转义符<<>>&&”"©&apos3865 人浏览
-
xiaozhi
-
25.JavaScript什么时候不使用箭头函数
原文：https://dmitripavlutin.com/when-not-to-use-arrow-functions-in-javascript/译者：前端小智为了保证的可读性，本文采用意译而非直译。想阅读更多优质文章请猛戳GitHub博客,一年百来篇优质文章等着你！这些年来，ES6 将 JS 的可用性提升到一个新的水平时: 箭头函数、类等等,这些都很棒。箭头函数是最有价值的新功能之一，有很3858 人浏览
-
xiaozhi
-
5.React 新特性 Hooks 讲解及实例(二)
什么是 HooksHook 是 React 16.8 的新增特性。它可以让你在不编写类组件的情况下使用state以及其他的React特性。类组件的不足状态逻辑复用难缺少复用机制渲染属性和高阶组件导致层级冗余趋向复杂难以维护生命周期函数混杂不相干逻辑相干逻辑分散在不同生命周期this 指向困扰内联函数过度创建新句柄类成员函数不能保证thisHooks 优势优化类组件的三大问题函数组件无 this 问3857 人浏览
-
xiaozhi
-
19.JavaScript 是如何工作的：编写自己的 Web 开发框架 + React 及其虚拟 DOM 原理
响应式原理Proxy 允许我们创建一个对象的虚拟代理（替代对象），并为我们提供了在访问或修改原始对象时，可以进行拦截的处理方法（handler），如 set()、get() 和 deleteProperty() 等等，这样我们就可以避免很常见的这两种限制(vue 中)：添加新的响应性属性要使用 Vue.$set()，删除现有的响应性属性要使用数组的更新检测Proxyletproxy=newProx3840 人浏览
-
xiaozhi
-
29.5个 JS 解构有趣的用途
1. 交换变量通常交换两个变量的方法需要一个额外的临时变量,来看看例子：leta=1; letb=2; lettemp; temp=a; a=b; b=temp; a;//=>2 b;//=>1temp是一个临时变量，它先保存a的值。然后把b的值赋值给a，接着将temp值赋给b。如果使用解构的方式会更简单，不需要什么鬼的temp变量。leta=1; letb=23828 人浏览
-
web
-
html5和css3实现无插件拖拽上传图片(支持预览与批量)(一）
转载请标明出处：http://blog.csdn.net/lmj623565791/article/details/31498319上传基本是项目中经常出现的，一般采用：1、form提交2、flash3、HTML5form提交会刷新页面，很难做到异步上传；flash可能是用得比较多了，因为可以兼顾到几乎所有的浏览器，我之前一直会用jQuery的uploadify作为项目中的上传工具，uploadi3827 人浏览