Web开发( 右侧选择分类 )
web

Html5 Css3实现VCD包装盒个性幻灯片

转载请标明出处:http://blog.csdn.NET/lmj623565791/article/details/...哈,首先感谢下w3cfuns的老师,嗯~好了,这次给发夹分享一个CSS3+JavaScript VCD包装盒个性幻灯片的一个案例。效果图:图片切换是不是很个性,效果也很不错,大家可以将其使用到自己的网站上。先看下html:<!DOCTYPE HTML PUBLIC "-/
2195 人浏览
xiaozhi

17.JavaScript 是如何工作: Shadow DOM 的内部结构+如何编写独立的组件

概述Web Components 是一套不同的技术,允许你创建可重用的定制元素,它们的功能封装在你的代码之外,你可以在 Web 应用中使用它们。Web组件由四部分组成:Shadow DOM(影子DOM)HTML templates(HTML模板)Custom elements(自定义元素)HTML Imports(HTML导入)在本文中主要讲解Shadow DOM(影子DOM)Shadow DOM
2186 人浏览
web

从Vue.js源码角度再看数据绑定

写在前面因为对Vue.js很感兴趣,而且平时工作的技术栈也是Vue.js,这几个月花了些时间研究学习了一下Vue.js源码,并做了总结与输出。 文章的原地址:https://github.com/answershuto/learnVue。 在学习过程中,为Vue加上了中文的注释https://github.com/answershuto/learnVue/tree/master/vue-src,希
2184 人浏览
hangge

K8s - 免费的Kubernetes在线实验平台介绍2(官网提供的在线系统)

kubernetes(简称K8s)是一个开源的,用于管理云平台中多个主机上的容器化的应用。 在之前的文章中,我介绍如何通过Docker为我们提供的实验网站Play with Kubernetes(PWK)来搭建Kubernetes集群(点击查看)。 但如果每次学习时都需要重新搭建一个K8s集群还是很麻烦。好在Kubernetes官网已经为我们准备好了现成的最小可用系统。我们通过Web浏览器就可
2184 人浏览
web

input只允许上传图片类型文件

指定只允许选择图片accept="image/*"例如:<input type="file" name="file" class="element" accept="image/*">但是:这段代码在Chrome和Safari等Webkit浏览器下却出现了响应滞慢的问题,可能要等 6~10s 才能弹出文件选择对话框。简直不能忍呀。解决方法:确切指定类型例如:<input typ
2181 人浏览
xiaozhi

7.React 新特性 Hooks 讲解及实例(四)

使用 Ref Hooks类组件中使用 Ref 一般有:String RefCallback RefCreateRef上述在函数组件中没有办法使用它们,取而代之的是useRefHooks。useRef主要有两个使用场景:获取子组件或者 DOM 节点的句柄渲染周期之间的共享数据的存储大家可能会想到 state 也可跨越渲染周期保存,但是state的赋值会触发重渲染,但是ref不会,从这点看 ref 更
2180 人浏览
xiaozhi

30.JS可选链的好处

JS的一些特性极大地改变了咱们的编码方式。从ES6年开始,对咱们代码影响最大的特性的解 、箭头函数、类和模块系统。到2019年8月,一个新的可选链提案已经进入第三阶段,这是一个很好的改进。可选链接改变了从深层对象结构访问属性的方式。来看看这是又是什么骚操作。这个礼拜《大迁世界》有抽奖活动,奖品:专栏 《左耳听风》 x3, 技术书 x5,欢迎关注回复:抽奖问题由于JS的动态特性,对象可以具有多层不同
2177 人浏览
web

html5和css3实现绚丽动画-诱人的实例 3D旋转木马效果相册

转载请标明出处:http://blog.csdn.net/lmj623565791/article/details/32964301首先说明一下创意的出处:http://www.zhangxinxu.com/study/201209/pictures-3d-slide-view.html(张鑫旭的博客 ),对前台感兴趣的可以没事去看看他的博客,很给力~这篇博客的目的是因为上篇HTML5 CSS3专
2175 人浏览
xiaozhi

33.JS中,如何提高展开运算符的性能

本文主要讲解怎么提高展开运算的性能,在此之前先简单说说展开运算在数组中的工作原理。展开运算符或三个点,接受一个数组数组或通常是可迭代的[... arrayOrIterable]并将数组元素分解,并使用这些分解部分构造一个新数组。展开运算符可以放在数组中的任何位置:constnumbers=[1,2,3]; [0,...numbers];//=>[0,1,2,3] [0,...number
2159 人浏览
xiaozhi

26.Promise 中的三兄弟 .all(), .race(), .allSettled()

作者:Dr. Axel Rauschmayer译者:前端小智来源:2ality为了保证的可读性,本文采用意译而非直译。想阅读更多优质文章请猛戳GitHub博客,一年百来篇优质文章等着你!从ES6 开始,我们大都使用的是Promise.all()和Promise.race(),Promise.allSettled()提案已经到第4阶段,因此将会成为ECMAScript 2020的一部分。1.概述Pr
2138 人浏览
xiaozhi

6.Web 性能优化:Preload,Prefetch的使用及在 Chrome 中的优先级

今天,我们将深入研究Chrome 的网络栈,以明确 web 加载原语(如<link rel= preload >&<link rel= prefetch >) 背后的工作原理,以便你能够更有效地使用它们。如其他文章所述,preload是一个声明式fetch,可以强制浏览器在不阻塞document的onload事件的情况下请求资源。Prefetch告诉浏览器这个资源将
2135 人浏览
xiaozhi

20.JavaScript 是如何工作的:模块的构建以及对应的打包工具

如果你是 JavaScript 的新手,一些像 “module bundlers vs module loaders”、“Webpack vs Browserify” 和 “AMD vs.CommonJS” 这样的术语,很快让你不堪重负。JavaScript 模块系统可能令人生畏,但理解它对 Web 开发人员至关重要。在这篇文章中,我将以简单的言语(以及一些代码示例)为你解释这些术语。 希望这对你
2128 人浏览
wechat

如何获取小程序的openid

小程序的openid相当重要,它是用户的唯一标识id,牵扯的支付,登录,授权等!你可以理解为小程序的账号,小程序是获取不到你的微信号的,这个属于私密信息!只能获取用户的昵称,头像,openid,session_key等下面就讲解一下我获取openid首先,获取openid,需要具备,AppID(小程序ID),AppSecret(小程序密钥) ,还有登录成功后返回给你的js_code废话不多说,先看
2118 人浏览
cheng

2020最新Web前端经典面试试题及答案-史上最全前端面试题(含答案)

近期总结一一些面试题 都是企业的面试题笔记题感觉薪资10k下的都会出笔试题 特别高的薪资都是直接技术面试或者是 现场编程 总结很多人的面试题,后期会对于单个知识点再说笔记详细讲解。部分都是百度的答案,不是特全面的,可以自己找下=============================================================前端面试题: 1. 一个200*200的div在
2118 人浏览
xiaozhi

5.React 新特性 Hooks 讲解及实例(二)

什么是 HooksHook 是 React 16.8 的新增特性。它可以让你在不编写类组件的情况下使用state以及其他的React特性。类组件的不足状态逻辑复用难缺少复用机制渲染属性和高阶组件导致层级冗余趋向复杂难以维护生命周期函数混杂不相干逻辑相干逻辑分散在不同生命周期this 指向困扰内联函数过度创建新句柄类成员函数不能保证thisHooks 优势优化类组件的三大问题函数组件无 this 问
2118 人浏览
hangge

SpringBoot - 整合Thymeleaf模板引擎(附样例)

一、基本介绍1,什么是 ThymeleafThymeleaf是新一代的Java模版引擎,类似于Velocity、FreeMarker等传统Java模版引擎。Thymeleaf的主要目标是将优雅的自然模板带到开发工作流程中,并将HTML在浏览器中正确显示,并且可以作为静态原型,让开发团队能更容易地协作。Thymeleaf能够处理HTML、XML、JavaScript、CSS甚至纯文本。Thymele
2107 人浏览
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=2
2097 人浏览
xiaozhi

19.JavaScript 是如何工作的:编写自己的 Web 开发框架 + React 及其虚拟 DOM 原理

响应式原理Proxy 允许我们创建一个对象的虚拟代理(替代对象),并为我们提供了在访问或修改原始对象时,可以进行拦截的处理方法(handler),如 set()、get() 和 deleteProperty() 等等,这样我们就可以避免很常见的这两种限制(vue 中):添加新的响应性属性要使用 Vue.$set(),删除现有的响应性属性要使用数组的更新检测Proxyletproxy=newProx
2089 人浏览
xiaozhi

6.React 新特性 Hooks 讲解及实例(三)

使用 Context Hooks使用 Context ,首先顶层先声明Provier组件,并声明value属性,接着在后代组件中声明Consumer组件,这个Consumer子组件,只能是唯一的一个函数,函数参数即是Context的负载。如果有多个Context,Provider和Consumer任意的顺序嵌套即可。此外我们还可以针对任意一个Context使用contextType来简化对这个Co
2083 人浏览
xiaozhi

9. 4 个 useState Hook 示例

为了保证的可读性,本文采用意译而非直译。想阅读更多优质文章请猛戳GitHub博客,一年百来篇优质文章等着你!到 React 16.8 目前为止,如果编写函数组件,然后遇到需要添加状态的情况,咱们就必须将组件转换为类组件。编写class Thing extends React.Component,将函数体复制到render()方法中,修复缩进,最后添加需要的状态。今天,可以使用 Hook 获得相同的
2061 人浏览