![](https://img-blog.csdnimg.cn/20201014180756930.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
HTML5技术
文章平均质量分 62
大飞飞鱼
做自己喜欢的事情,任凭别人去说吧
展开
-
thinkphp 模板代码中数值比较的正确写法,thinkphp 模板如何进行纯真的数值比较
在thinkphp中,编写模板时需要用到比较,本文记录了thinkphp 模板代码中的比较的数值正确写法,thinkphp 模板如何进行数值比较的解决办法原创 2024-02-20 00:00:42 · 330 阅读 · 0 评论 -
art-template, node_modules doesn‘t exist or is not a directory
webpack 找不到art-template的解决办法原创 2024-01-24 12:21:42 · 767 阅读 · 0 评论 -
Javscript 之循环遍历,for,for...in,for...of,forEach 的使用说明
本文介绍了javascript语言中循环迭代方法for,for...in,for of,forEach 的使用说明,分门归类,别于正确使用原创 2023-11-04 10:58:53 · 424 阅读 · 0 评论 -
javascripts ~~运算符是什么意思,js ~~ 的含义,js !! 代表什么,js **代表什么
运算符只能对整数进行计算,如果~后面如果跟的值不是int类型,将会被强制转换为int类型。如果~后面跟字符串,浮点数,布尔值,都会转化为整数。!!是两次布尔取反,用于将数值,字符串、null转黄为boolean值true或者false。原创 2023-10-26 17:36:51 · 214 阅读 · 0 评论 -
DIV的resize事件不响应的解决办法,解决html 的div或其他元素监听 resize事件不生效的问题
DIV的resize不响应的解决办法,该办法代码短小精悍,原理简单移动,可以方便复制粘贴。原创 2023-05-12 12:58:02 · 2725 阅读 · 1 评论 -
Javascript Map 对象使用说明
Map 是 ES6 中引入的一种新的数据结构,对象保存键值对。任何值(对象或者原始值) 都可以作为一个键或一个值。以前用的JS对象 Object也是可以把其属性看作键来定位数据,但 Map 和 Object 是有区别的。原创 2023-01-17 16:26:41 · 2214 阅读 · 0 评论 -
React useCallback 函数使用说明
React 中useCallback的作用:记录函数实例,返回相同的函数实例解决函数相等性检查问题,本文阐述了useCallback的功能与正确使用事项原创 2023-01-14 13:47:37 · 1634 阅读 · 0 评论 -
JS 中的=>箭头函数使用说明
JS箭头函数的基本使用说明,本文阐述的箭头函数的语法定义与基本使用说明原创 2023-01-03 21:18:23 · 4018 阅读 · 0 评论 -
JS 定义对象时,key加中括号表示什么意思,javascript 属性名加[] 的意义
对象key加中括号是 取中括号中变量的内容 当做对象的key使用,不加中括号,则直接用该字符串当作对象的key。原创 2022-11-23 22:42:02 · 1061 阅读 · 0 评论 -
javascript 数组方法 slice() 的使用说明
javascript的数组对象有一个方法slice,通过索引位置从原数组中截取一个片段构成新的数组,该方法不会修改原数组,只是返回一个新的子数组。原创 2022-11-18 22:58:26 · 2985 阅读 · 0 评论 -
javascript 语言中的 ==和=== 的意义区别
== :表示相等,只要两个变量的值转换后相等即可在用==进行比较时,js解释器先检查两个操作数数据类型,如果相同, 则进行值比较, 如果不同, 则会自动进行类型转换, 转换成字符串类型后再进行值比较。=== :表示严格相等,代表严格相等,即值相等,类型也必须相等在用==进行比较时,js解释器先检查两个操作数数据类型如果类型不同,直接就不比较了。原创 2022-11-18 22:08:00 · 219 阅读 · 0 评论 -
React 函数组件导出自定义方法的办法说明
本文阐述了React函数型组件如何暴露自己的方法的实现办法。在进行React开发时,函数组件是比较方便的,由于函数组件没有this指针,因此如果想在父组件里调用函数型子组件的方法,就需要用到React.useImperativeHandle 这个帮助函数。原创 2022-11-10 12:20:54 · 1962 阅读 · 0 评论 -
React 的生命周期
React 的生命周期,本样本展示了React生命周期的各阶段。原创 2022-10-26 11:39:32 · 386 阅读 · 0 评论 -
React Fragment 用途说明-节点片段,不创建额外DOM
React.Fragment 组件能够在不额外创建 DOM 元素的情况下,让 render() 方法中返回多个元素。一个常见模式是一个组件返回多个元素。Fragments 允许你将子列表分组,而无需向 DOM 添加额外节点。原创 2022-10-26 09:49:15 · 696 阅读 · 0 评论 -
React 属性验证 propTypes
React prop验证使用propTypes,它可以保证我们的应用组件被正确使用,React.PropTypes 提供很多验证器 (validator) 来验证传入数据是否有效。当向 props 传入无效数据时,JavaScript 控制台会抛出警告。原创 2022-10-25 17:53:47 · 1108 阅读 · 0 评论 -
React.createContext 的使用说明--用于解决多级组件的传值问题
当你不想在组件树中通过逐层传递 props 或者 state 方法来传递数据时,可以使用Context来实现跨层级的组件数据传递。React.createContext 就是用于解决祖先组件与后代组件(中间隔了好多层组件)传值问题。原创 2022-10-25 12:59:31 · 1166 阅读 · 0 评论 -
Node 之 React ref 最新版本的用法
在进行React开发时,有时在组件的代码中需要访问实际的Dom对象,这个时候就要用到ref这个属性来将 dom对象的值保存进来,以便代码访问。原创 2022-10-24 22:43:39 · 578 阅读 · 0 评论 -
将SVG 转换为png -- ImageMagick 转换 svg 为透明png 图
SVG 是当今流行的网络图像格式,有时候需要将SVG 转换为png图。因为SVG是矢量图,本身是透明的,因此转换为PNG时,我们也需要它是透明的。本文简单描述了如何使用原创 2022-06-13 14:14:41 · 3404 阅读 · 0 评论 -
React 之react-redux的connect方法的使用说明
本文详细介绍了React 之react-redux的connect方法, reactUI组件只负责 UI 的呈现,不带有任何业务逻辑,UI组件内部不再操作state(状态值,如果不使用React-Redux,可以用state来保存值),所有的参数都是通过this.props来获取。............原创 2022-06-05 23:02:26 · 2075 阅读 · 0 评论 -
H5中的history单页面,手动实现单页面开发,细说h5单页面原理
就目前来看,前端的单页面开发占了很大一部分,一方面无刷新的切换增强了体验,并且浏览器记录依然存在,前进后退都没问题,在之前我们通地址栏中的hash改变来触发onhashchange方法来实现单页面应用,但是#的形式总是令人不爽,幸好h5新增了history.pushState与history.replaceState。1.介绍APIhistory.pushState(data, title [, url]):往历史记录堆栈顶部添加一条记录; data会在onpopstate事件触发时作为参数传递原创 2022-01-01 11:44:15 · 1739 阅读 · 0 评论 -
Chrome 94版本及以后公网网页不能向私网POST请求的问题
问题:以前的系统将网页部署在公网,应用服务器部署在私网,用Chrome浏览器一直能够正常工作,今天,突然发现不能工作了,而系统代码未做任何改动,就不行了。通过搜索发现问题的原因如下:从2021年9月22号,Chrome 94 已正式发布。Chrome 94 默认开启“阻止不安全的专用网络请求”,将使得http的站点请求私有网络接口被拦截。通过查看Chrome的版本信息如下:原来我的Chrome浏览器被Google公司偷偷地升级为94版本了,所以出现了问题。问题解决办法1、临.原创 2021-10-10 12:58:38 · 2059 阅读 · 1 评论 -
ES6中export及export default的区别
在JavaScript ES6中,export与export default均可用于输出常量、函数、文件、模块等符号,调用时可以在其它文件或模块中通过import+(常量 | 函数 | 文件 | 模块)名的方式,将其导入,以便能够对其进行使用。export 与 export default究竟有何区别呢?1、一个模块中文件中,export可以有多个,export default仅有一个。function func1() { ... }function func2() { ... }func原创 2021-08-23 17:57:55 · 351 阅读 · 0 评论 -
Javascript ES6中export与import指令使用说明
javascript ES6 支持模块化编程,模块是独立的文件,该文件内部的所有的变量与函数都是局限在该模块内部,外部模块无法访问,如果需要在调用的模块之内使用这些符号,模块内部的变量与函数必须设置为输出。符号的输出是通过export关键字来制定的。一、export// tools.js//输出变量方式1export var firstName = 'Michael';export var lastName = 'Jackson';export var year = 2021;//输原创 2021-08-23 17:30:03 · 2438 阅读 · 1 评论 -
v-bind,v-on 缩写, 冒号与@
<!-- 完整语法 --><a v-bind:href="url">...</a><!-- 缩写 --><a :href="url">...</a><!-- 动态参数的缩写 (2.6.0+) --><a :[key]="url"> ... </a>v-on缩写<!-- 完整语法 --><a v-on:click="doSomething">...&..原创 2021-08-22 11:49:15 · 607 阅读 · 0 评论 -
Vue——slot的含义是什么, slot之详细解释
slot 英文的意思是“插槽”的意思,vue用这个词做标签,意思是能够在这个标签里插入一些东西,是由调用组件(父组件)向其调用的子组件里插入一些东西的一个解决办法。slot的语法如下:<slot></slot>以上这段代码是书写在需要支持插入能力的子组件里的,有了这段标签代码后,子组件就支持父组件向其内部插入东西了。一个支持slot的子组件的模板html如下:<template> <div class="slot-child">原创 2021-08-22 10:31:19 · 3515 阅读 · 0 评论 -
js 三个点(...),扩展运算符说明
在开发nodejs应用时,发现一些代码中符号前面有三个点(...),这个是什么意思了。原来三个点(...)真名叫扩展运算符,是在ES6中新增加的内容,它可以在函数调用/数组构造时,将数组表达式或者string在语法层面展开;还可以在构造字面量对象时将对象表达式按照key-value的方式展开。说白了就是把外层包裹去除,不管是大括号([])、花括号({}),统统不在话下。字面量一般指 [1,2,3,4,5] 或者 {name:'Tom',age:19} 这种简洁的构造方式,多层嵌套的数组和对象三个点就无原创 2021-08-21 18:10:58 · 8475 阅读 · 0 评论 -
Windows下用OpenSSL生成CA根证书及签发server端证书
一、先下载编译好的OpenSSL程序,并展开后放在E:盘,目录结构如下所示目前放在的目录为:E:\OpensslX64二、打开一个CMD控制台窗口,设置好openssl.cnf路径用以下控制台命令进入到E:\OpensslX64\bin,并设置好openssl.cnf路径。E:cd E:\OpensslX64\binset OPENSSL_CONF=E:\OpensslX64\conf\openssl.cnf三、在当前目录E:\OpensslX64\bin 里创建两个...原创 2021-08-14 11:11:07 · 9200 阅读 · 0 评论 -
CSS的display:flex说明
在进行网页前端设计时,需要垂直居中显示文本,但CCS似乎没有明确的垂直居中的代码方法,由于目前的页面不再考虑以前的浏览器了,因此采用CSS3的display:flex方法来实现。现记录一下flex属性的相关资料。Flex是Flexible Box的缩写,意为"弹性布局",用来为盒状模型提供最大的灵活性。设为Flex布局以后,子元素的float、clear和vertical-align属性将失效。它即可以应用于容器中,也可以应用于行内元素。(以上说明结合微信开发者工具说明)2009年,W3C提出了原创 2021-08-11 18:07:33 · 12808 阅读 · 0 评论 -
用Webrtc实现免费的1对1高清实时视音频会议系统
前言WebRTC,它是由谷歌推广的实时音视频技术栈,是W3C的标准,WebRTC技术的本质是构建点对点的实时通信,目前主流的浏览器,包括Chrome, Firefox, Edge等,天然就支持WebRTC协议。对入门开发者来说,选用这几款浏览器,连开发客户端的时间都省了。技术实现原理最简单的Web视频会议,只需要架设一个Web服务器,服务器兼具信令交换的能力(信令服务也可以独立部署),两个浏览器通过Web Server交换会话信息,就能建立P2P通道来传输媒体流,进行1v1的视频会议。如下图所示:原创 2021-06-08 21:59:11 · 1059 阅读 · 0 评论 -
Vue路由与 vue-router 的使用说明手册
vue-router 基本使用 路由,其实就是指向的意思,当我点击页面上的home按钮时,页面中就要显示home的内容,如果点击页面上的about 按钮,页面中就要显示about 的内容。Home按钮 => home 内容, about按钮 => about 内容,也可以说是一种映射. 所以在页面上有两个部分,一个是点击部分,一个是点击之后,显示内容的部分。点击之后,怎么做到正确的对应,比如,我点击home 按钮,页面中怎么就正好能显示home的内容。这就要在js 文件中配置路由。路由原创 2021-06-01 16:20:51 · 364 阅读 · 0 评论 -
javascript 的Uint8Array 构造函数对 typedArray的引用问题
javascript 的 Uint8Array 支持字节数据,对于操作二进制数据非常有用,笔者初次接触时发现它有几个构造函数,如下:new Uint8Array(); new Uint8Array(length);new Uint8Array(typedArray);new Uint8Array(object);new Uint8Array(buffer [, byteOffset [, length]]); 这些函数都返回一个Uint8Array类型的对象,但对于 new ...原创 2020-08-18 16:57:57 · 1519 阅读 · 0 评论 -
jQuery性能优化注意事项
jQuery是目前网页前端设计的必备工具,几乎没有不使用的,能够大大提高javascript的开发速度,但如果不注意使用,经常导致网页的解析速度慢,这里总结了一些jQuery使用当中的注意事项,有助于提高程序的执行效率。1、定义jQuery变量的时候添加var关键字这个不仅仅是jQuery,所有javascript开发过程中,都需要注意,请一定不要定义成如下:$lo...原创 2020-01-22 00:35:10 · 242 阅读 · 0 评论 -
Websocket Frame 格式(Websocket 数据帧格式)
今天,公司要求在媒体服务器上实现websocket-flv播放,即通过Websocket技术来实现flv播放。笔者以前曾用Websocket协议实现过一个百万级别的即时通信服务器,但到今日已有时日,对Websocket协议的帧格式是记不清楚了,今日正好重新复习一下,做笔记如下,已备忘。 浏览器通过GET方式发送Websocket请求,服务器通过判断其请求头部是否包含 ...原创 2019-12-29 23:29:31 · 9306 阅读 · 0 评论 -
JS 微信内置浏览器判断
用如下简单代码即可function isWeixin(){ return navigator.userAgent.indexOf("MicroMessenger")>0;}原创 2019-12-06 22:38:20 · 135 阅读 · 0 评论 -
javascript 判断是否手机浏览器,微信内建浏览器
javascript 在浏览器端判断是否手机浏览器的简单代码如下,也包括微信内建浏览器的判断。function isMobile() { var userAgent = navigator.userAgent; var mobileAgents = ["Android", "iPhone","MicroMessenger", "Symbian...原创 2019-12-06 22:17:00 · 268 阅读 · 0 评论 -
Flash实现Websocket的跨域问题-安全沙箱问题解决办法
笔者在开发一款大型的直播交互平台时采用了Websocket技术来实现文字、弹幕与语音的交互,当前主流的浏览器都内建了Websocket的支持,因此直播平台在大多数浏览器上运行良好。但由于平台需要支持IE8(或以下版本)浏览器,由于IE没有内置的Websocket支持,因此考虑采用Flash实现一个代理层来支持Websocket,当Flash代码实现好后在IE中一运行,发现总是提示安全沙箱冲突,如下...原创 2017-08-25 11:54:00 · 4356 阅读 · 2 评论 -
Webrtc 多人视频会议系统 服务器 Licode 介绍
WebRTC又称 web实时通信,主要是为了扩展浏览器的功能,使浏览器能够进行实时音视频通信,不同的浏览器对Webrtc的实现代码也许不同,但Google的浏览器将Webrtc的实现代码开源了,以至于很多人一听到Webrtc就联想到Google的开源实现,以至于误以为使用Webrtc就非常难,因为Webrtc的实现都是C/C++代码,让很多人望而生畏。其实我们只需要懂得浏览器端的Ja...原创 2018-04-14 16:02:07 · 8402 阅读 · 0 评论 -
Webrtc 开源代码的简单介绍
WebRTC提供了视频会议的核心技术,包括音视频的采集、编解码、网络传输、显示等功能,并且还支持跨平台:windows,linux,mac,android, iOS等。Webrtc 是多媒体通信技术的未来趋势,Google为了成为标准的主导者,将Chrome浏览器里的Webrtc实现代码开源了,浏览器的开源的WebRTC是众多同仁学习研究的重要资源,这个开源实现中的任何的一个技术点都...原创 2018-04-14 16:38:53 · 1286 阅读 · 0 评论 -
HTTP文件上传服务器-支持超大文件HTTP断点续传的实现办法
最近由于笔者所在的研发集团产品需要,需要支持高性能的大文件http上传,并且要求支持http断点续传。笔者在以前的博客如何实现支持大文件的高性能HTTP文件上传服务器已经介绍了实现大文件上传的一些基本概念,其实非常简单,这里在简要归纳一下,方便记忆:服务器端由C语言实现,而不是用java、PHP这种解释型语言来实现; 服务器端即时写入硬盘,因此无需再次调用move_uploade...原创 2018-06-03 21:45:58 · 32714 阅读 · 2 评论 -
HTML5文件上传,断点续传的开发实现笔记
本文基于HTML5 的FILE API 实现了一个HTTP断点续传系统,支持HTTP超大文件断点续传,兼容目前主流浏览器,可移植性非常好,可以适应与PC、iOS与Android系统。原创 2018-06-05 20:30:46 · 7268 阅读 · 0 评论