直播训练营

鸿蒙开发者社区

WOT技术大会

AIGC创新中国行

公众号矩阵

移动端

短视频免费课程课程排行直播课软考学堂

全部课程厂商认证 IT技术 2024年软考 PMP项目管理软考资讯

文章资源问答课堂专栏直播

51CTO

鸿蒙开发者社区

51CTO技术栈

51CTO官微

51CTO学堂

51CTO博客

CTO训练营

鸿蒙开发者社区订阅号

51CTO题库小程序

51CTO学堂APP

51CTO学堂企业版APP

鸿蒙开发者社区视频号

账号设置退出

前端

2.4w内容

关注

分享前端领域的前沿热点、技术实战、框架应用和使用案例，为开发者学习前端技术提供参考。

文章博文帖子课程

共 715 条

web技术分享| webRTC 媒体流录制

音视频的录制音视频的分为服务端录制和客户端录制，下面主要讲的是利用webrtc进行客户端录制的方式。因为WebRTC录制音视频流之后，最终是通过Blob对象将数据保存成多媒体文件的，Blob对象表示一个不可变、原始数据的类文件对象。它的数据可以按文本或二进制的格式进行读取，也可以转换成ReadableStream来用于数据操作。Blob表示的不一定是JavaScript原生格式的数据。File接口

2021-09-09 11:08:30

web技术分享 webrtc 流媒体录制

学会这5种JS函数继承方式，前端面试你至少成功50%

函数继承是在JS里比较基础也是比较重要的一部分，而且也是面试中常常要问到的。下面带你快速了解JS中有哪几种是经常出现且必须掌握的继承方式。掌握下面的内容面试也差不多没问题啦~

2021-09-07 11:18:21

前端 JS 函数继承

Node.js 应用全链路追踪技术——[全链路信息获取]

随着 Nodejs 对大前端技术栈的渗透，开发场景越来越多，如小程序、H5、BFF、工具链，同时和微服务外部系统交互多，如数据库场景 MySQL，Mongodb，Redis、RPC的分布式异构语言服务调用 Java dubbo, Go Grpc。面对这些复杂的场景，我们需要全局视角的错误追踪、问题定位和性能诊断。

2021-09-06 09:32:45

全链路追踪前端

一文搞懂jsBridge的运行机制

我司的APP是一个典型的混合开发APP，内嵌的都是前端页面，前端页面要做到和原生的效果相似，就避免不了调用一些原生的方法，jsBridge就是js和原生通信的桥梁，本文不讲概念性的东西，而是通过分析一下我司项目中的jsBridge源码，来从前端角度大概了解一下它是怎么实现的。js调用方式先来看一下，js是怎么来调用某个原生方法的，首先初始化的时候会调用window.WebViewJavascrip

2021-09-05 23:16:55

【神来之笔】原生 JavaScript 手写数组 API

!数组API(https://s4.51cto.com/images/blog/202109/02/fc53db952e3be8cd276c325e93577718.png?xossprocess=image/watermark,size_14,text_QDUxQ1RP5Y2a5a6i,color_FFFFFF,t_100,g_se,x_10,y_10,shadow_20,type_ZmFuZ3

2021-09-02 19:17:26

JavaScript api 前端

09 bootstrap快速搭建前端

python"""addClass()classList.add()removeClass()hasClass()toggleClass()"""css操作python.css(属性名,属性值)"""jQuery链式操作一行代码可以搞定很多事情jQuery对象在调用jQuery方法之后返回的还是当前对象本身(本质:returnself)"""位置操作pythonscrollTopscrollLef

2021-08-27 09:22:33

解决 API 开发中遇到的 CORS 问题

介绍当你在开发API的时候，肯定会遇到前端反馈CORS的问题，CORS政策阻止了对API的获取访问：对预检请求的响应未通过访问控制检查：请求中不存在“AccessControlAllowOrigin”标头资源。如果不透明响应满足您的需求，请将请求的模式设置为“nocors”以在禁用CORS的情况下获取资源。如果你曾经构建过想要与RESTAPI交互的Web应用程序，你可能熟悉这个错误。如果你还构建了

2021-08-25 11:15:12

vue基于百度地图api开发签到打卡功能

vue 基于百度地图api开发签到打卡功能。

2021-08-25 09:54:35

vue js 签到打卡

几种常用设计模式的简单示例

学习设计模式不仅可以使我们用好这些成功的设计模式，更重要的是可以使我们深入理解面向对象的设计思想。

2021-08-21 23:23:42

JavaScript 设计模式前端

浅析 Map 和 WeakMap 区别以及使用场景

希望这一篇文章能让你对 Map 有更好的理解，或者能够帮你理解 Map 和 WeakMap 这篇文章会先从Map再到WeakMap 一、为什

2021-08-21 08:15:33

JavaScript 前端 es6

web技术分享| 实现WebRTC多个对等连接

流程简介通过MediaDevices.getUserMedia()获取音频和视频轨道。通过createOffer()启动与远程对等方的新WebRTC连接。用信令通信上传错误并控制启动或关闭会话。互换媒体和客户端信息初始化操作元素javascriptconststartButton=document.getElementById('startButton');constcallButton=docu

2021-08-19 11:03:03

web技术分享 webrtc javascript

仿得物微信小程序（动手就会

本文章转自：乐字节文章主要讲解：微信小程序开发获取更多Java相关资料可以：测测你的编程天赋最近正在学习微信小程序开发，也是与两个同学一起合作着手仿做得物APP微信小程序。这里主要分享一下我的学习过程及踩过的一些坑，希望对您有所帮助。开发准备微信开发者工具 VScode代码编辑器得物APP微信小程序有赞vant组件库阿里巴巴矢量图标库 markman（取色量距）总体

2021-08-18 19:08:45

微信小程序 JS Java

JS对象拷贝：深拷贝和浅拷贝

对象拷贝，简而言之就是将对象再复制一份，但是，复制的方法不同将会得到不同的结果。

2021-08-18 11:03:59

JS 对象拷贝深拷贝

我用 140 行代码，带你看一场流星雨⭐

!背景图(https://s4.51cto.com/images/blog/202108/18/832ad9fa84820284ab69d29cf242d46c.png?xossprocess=image/watermark,size_14,text_QDUxQ1RP5Y2a5a6i,color_FFFFFF,t_100,g_se,x_10,y_10,shadow_20,type_ZmFuZ3po

2021-08-18 07:19:52

前端 sass JavaScript

08 jquery 属性操作，事件绑定

js事件pythonjs绑定事件的两种方式自己独立的敲出来昨天的案例"""1.开关灯pEle.classList.add()...2.input框获取、失去焦点onfocusonblur3.计时器onclickjs代码逻辑4.省市联动onchange文本域变化就记忆一个select"""jQuery简介python"""内部封装了并且提供了额外功能的模块、框架类库兼容多个浏览器版本更新1.X2.X

2021-08-17 10:50:24

jquery 常用案例属性操作

BOM与DOM操作BOM操作pythonwindow对象window.innerHeightwindow.innerWidthwindow.open()新建窗口打开指定的页面window.open(url,'','height,width,top,bottom')window.close()关闭当前窗口navigator对象navigator.userAgent后面讲爬虫还会涉及history对象

2021-08-16 09:05:19

jquery 基本用法

06 JS 中的BOM 和DOM 操作

"""HTMLpythonHTTP协议超文本标记语言就是一堆标签每个标签具有特定的含义是浏览器展示页面所公用的一套标准注释<!web服务的本质服务端客户端文件(.html)（你在浏览器上看到的花里胡哨的页面内部都是由HTML组成的）HTML文档结构htmlheadbody标签的分类1.单标签双标签2.块儿级标签行内标签特例:p标签一堆标签标题:h1h6uisbhrbr段落:p特殊符号&

2021-08-15 13:56:06

java中的BOM 和

小小装饰器

前言装饰器可对指定的类/类方法/属性/参数进行装饰,扩展其功能。它本质是一个函数,底层实现上依赖Object.defineProperty。逐步发展至今,装饰器不再只是简化代码的语法糖,还可作为某些特定场景的解决方案(比如鉴权)。保持装饰器的单一职责,通过灵活组合,可以让代码更为简洁明了,让开发更为高效。下面以一个ts项目为例,介绍下常用类型装饰器的基本使用和业务场景。项目初始化1.全局安装tsn

2021-08-11 22:31:32

05 java scrip 基础语法，流程控制，数据类型

浏览器默认优先展示文本内容清除浮动带来的影响python"""浮动的元素会造成父标签的塌陷解决塌陷推导步骤1.自己写一个标签强行撑起一个高度2.clear属性clear:left\right\both3.统一解决方式提前定义好后续直接使用.clearfix:after{content:'';display:block;clear:both;}谁塌陷了就给谁加上clearfix类属性"""溢出属性p

2021-08-11 10:25:37

基础语法流程控制数据类型

04 * 解决浮动带来的影响 * 溢出属性 * z-index

分组与嵌套python多个选择器可以并列公用一套css样式div,p,span{}不同选择器之间也可以混合使用.c1,d1span{}伪类选择器pythona:link{}a:hover{}需要记忆a:active{}a:visited{}input:focus{}input框获取焦点伪元素选择器pythonp:firstletter{}通过css加文本内容但是无法选中p:before{}p:af

2021-08-11 10:16:46

解决浮动带来的影响透明度opacity 定位

03 HTML分组与嵌套伪类选择器伪元素选择器选择器优先级 css属性相关

每日测验python"""今日考题1.列举字符串,列表，元组，字典每个常用的五个方法2.描述下列常见内置函数的作用可用代码说明map,zip,filter,sorted,reduce3.列举你所知道的面相对象中的__开头__结尾的方法及作用，越多越好4.写出form标签几个关键性的属性及作用5.列举你所知道的css选择器"""昨日内容回顾表格标签html<table<thead<tr一个tr就是一

2021-08-11 10:14:08

选择器优先级 css属性相关伪元素选择器

JavaScript 中的高阶函数

高阶函数JavaScript高阶函数是指以函数作为参数的函数，并且可以将函数作为结果返回的函数。1.高阶函数接受一个或多个函数作为输入输出一个函数至少满足以上一个条件的函数在js的内置对象中同样存在着一些高阶函数，像数组的map，filter，reduce方法等，它们接受一个函数作为参数，并应用这个函数到列表的每一个元素1.1mapmap方法接收一个函数作为参数，遍历数组，并且返回一个新的数组，新

2021-08-10 23:25:50

前端 JavaScript

【前端 · 面试】HTTP 总结（八）—— HTTP 强缓存

强缓存中，当请求再次发出时，浏览器会判断目标资源是否“命中”强缓存，如果命中则直接从缓存中获取资源，不会再与服务端发生通信。

2021-08-08 22:27:29

前端面试 HTTP缓存

关于JS中的作用域中的沉思

scope和closure是javascript中两个非常关键的概念，前者JS用多了还比较好理解而且容易体会到，而closure就不一样了。这玩意是真的很容易迷糊作用域作用域，也就是我们常说的词法作用域，说简单点就是你的程序存放变量、变量值和函数的地方。根据作用范围不同可以分为全局作用域和局部作用域，简单说来就是，花括号{}括起来的代码共享一块作用域，里面的变量都对内或者内部级联的块级作用域可见，

2021-08-07 17:59:43

作用域闭包局部变量

#导入MD文档图片#WebSocket的前后端使用

html5中websocket的使用

2021-08-05 15:59:38

websocket node html

从零开始写一个微前端框架-沙箱篇

从零开始实现一个简易的微前端框架，它的核心功能包括：渲染、JS沙箱、样式隔离、数据通信。由于内容太多，会根据功能分成四篇文章进行讲解，这是系列文章的第二篇：沙箱篇。

2021-08-04 16:41:09

微前端前端框架

#导入MD文档图片# 漫天的烟火送给遥远的你

漫天烟火送给遥远的你

2021-08-03 07:43:20

#导入MD文档图片# 使用 HTML、CSS、JS 和 API 制作一个很棒的天气 Web 应用程序

今天我将使用Weather和UnsplashAPI以及倾斜效果和玻璃形态外观创建凉爽的天气应用程序@TOC(⛅Weather.io☔)很高兴又见面了！

2021-08-02 15:56:51

#导入MD文档图片#

02 html表单标签 CSS 层贴样式

* 表格标签(只要是展示数据一般都可以使用表格标签) * 表单标签(重要:获取前端用户数据发送给后端) * 偷窥一下后端框架的基本使用(flask) * css层贴样式表(选择器) ### 表格标签 ... 一个tr就表示一行 username 加粗文本 username 正常文本

2021-07-26 16:27:28

CSS：from表单：html基础：

在` JavaScript`中，this 这个特殊的变量是相对比较复杂的，因为` this`不仅仅用在面向对象环境中，在其他任何地方也是可用的。 ` this`这个问题说实话是真的烦，与我们常见的很多语言不同，JS函数中的` this`指向并不是在函数定义的时候确定的，而是**在调用**的时候确定的。换句话说，函数的调用方式决定了` this`指向。在日常开发过程中，经常遇到由于this问

2021-07-26 00:30:30

js原理分析 this原理分析引用详情

优雅编程 | 7 个你应该掌握的 JavaScript 编码技巧

JavaScript 是一个灵活性很强的语言，有很多和其他语言不一样的特性，本文分享7 个日常开发中可以用到的 JavaScript 编码技巧，享受其优雅编程的快感。

2021-07-24 22:01:42

数组对象解构

01 html 基础标签使用

```python HTML:网页的骨架没有任何的样式 CSS:给骨架添加各种样式变得好看 JS:控制网页的动态效果前端框架:BOOTSTRAP、JQuery、Vue 提前给你封装好了很多操作你只需要按照固定的语法调用即可 ``` ### 软件开发架构 ```python cs 客户端服务端 bs 浏览器服务端 ps:bs本质也是cs ``` ### 浏览器窗口输

2021-07-22 19:59:50

html html各种标签

前端 JavaScript 实现一个简易计算器

前端使用 JavaScript 实现一个简易计算器，没有难度，但是里面有些小知识还是需要注意的，算是一次基础知识回顾吧。

2021-07-09 17:46:14

JavaScript 前端代码实现

黑科技：通过 Google Java Style 文件配置 IDEA 和 Ecplise 代码风格

文章目录引言Google Java Style 介绍源文件基础源文件结构格式化标识符命名规则Google Java Style 下载IDEA 配置 Google Java StyleEcplise 配置 Google Java Style引言在日常开发中，多人团队协作开发一个项目是很常见的，

2021-07-09 15:59:49

文章总览 # IDEA java

「免费开源」基于Vue和Quasar的前端SPA项目crudapi后台管理系统实战之文件上传（十）

基于Vue和Quasar的前端SPA项目实战之文件上传（十）

2021-07-09 10:28:41

crudapi-adm vue javascript

深入理解JavaScript编程中的同步与异步机制

JavaScript的优势之一是其如何处理异步代码。异步代码会被放入一个事件队列，等到所有其他代码执行后才进行，而不会阻塞线程。然而，对于初学者来说，书写异步代码可能会比较困难。而在这篇文章里，我将会消除你可能会有的任何困惑。理解异步代码JavaScript最基础的异步函数是setTimeout和setInterval。setTimeout会在一定时间后执行给定的函数。它接受一个回调函

2021-07-05 14:47:37

前端 JavaScript 之『防抖』的简单代码实现

在加入防抖代码之后，input 事件并不会每次输入都会输出在多行文本，而是会在用户停止输入 delay 时间之后触发输出，频率确实低了很多。

2021-06-17 21:12:17

前端 JavaScript 防抖节流

你有一份Rx编程秘籍请签收

利用已有的知识去理解一个新的概念，利用高阶函数的思想去理解响应式编程中Observable的本质。

2021-06-15 09:17:19

响应式编程 RxJs Observable

史上最全面的jQuery入门教程（视频|资料，建议收藏！）

jQuery是什么？ jQuery是一个快速、简洁的JavaScript框架，是继Prototype之后又一个优秀的JavaScript代码库(或JavaScript框架)。 jQuery设计的宗旨是“write Less，Do More”，即倡导写更少的代码，做更多的事情。它封装JavaScript常用的功能代码，提供一种简便的JavaScript设计模式，优化HTML文档操作、事件处理、动画

2021-06-09 15:24:45

jQuery jQuery入门 Java

javascript 0基础入门

JavaScript基础作者: 写代码的小鱼儿Email：282505458@qq.comQQ：282505458微信：15311464808说明：本文档用于学习交流，可传播可分享，如有错误，请联系小鱼儿，感谢矫正与探讨javascript简介http://www.ecma-international.org/memento/TC39.htm什么是JavaScriptjs ...

2021-06-07 17:11:32

JavaScript JavaScript

瀑布流特效

本文介绍并实现了瀑布流布局实现的三种方式：传统多列浮动、CSS3 样式定义、绝对定位。瀑布流，又称瀑布流式布局。是比较流行的一种网站页面布局，视觉表现为参差不齐的多栏布局，随着页面滚动条向下滚动，这种布局还会不断加载数据块并附加至当前尾部。最早采用此布局的网站是Pinterest，逐渐在国内流行开来。国内大多数清新站基本为这类风格。瀑布流特点：1、琳琅满目：整版以图片为主，大小不一的图片按照一定的规律排列。2、唯美：图片的风格以唯美的图片为主。3、操作简单：在浏览网站的时候只需要轻轻滑动一下鼠标滚轮，一切的美妙的图片精彩便可呈现在你面前。

2021-06-07 15:59:25

CSS盒子模型

CSS盒子模型（上）盒子模型（Box Model）是CSS控制页面时一个很重要的概念。只有很好地掌握了盒子模型以及其中每个元素的用法，才能真正地控制好页面中的各个元素。所有页面中的元素都可以看成是一个盒子，占据着一定的页面空间。一般来说这些被占据的空间往往都要比单纯的内容大。可以通过调整盒子

2021-06-07 15:05:35

WEB安全防护相关响应头 (上)

保障普通用户的安全，网站可以做些什么？

2021-06-03 15:13:53

html http Web安全

Web前端超度指南|最适合小白的JavaScript入门教程

Javascript，从“最被误解的语言”，最后神奇地转变成为“最流行的语言”，证明它经受得起时间的考验。虽然单独来看，它的交互设计有些失败，但是加上Ajax的完美配合，javascript就成了一款轻便并且又实用的好语法。如果想要更高效、更系统地学会javascript，最好采用边学边练的学习模式。如果觉得javascript的学习难度较高，不易理解，建议采用视频的方式进行学习，更易初学者吸收：

2021-06-02 16:57:54

JavaScript JavaScript入 JavaScript教

1.Ajax预备知识回顾1.1jQueryjQuery是一个非常强大的JavaScript库，它对JavaScript、CSS、DOM、AJAX等的操作步骤已经简化到极致，其主旨思想是：用更少的代码，实现更多的功能jQuery是一个兼容多种浏览器的JavaScript库1.2网络通信原理网络通信的基本原理。为了保证数据能够从目标源到达目的地，并且保证数据的完整性，两端都要使用的规范就是协议。协议决

2021-05-28 12:22:41

npm Commander基本使用

随着NodeJs的不断发展，对于前端来说要做的东西也就更多，Vue脚手架React脚手架等等等一系列的东西都脱颖而出，进入到人们的视野当中，对于这些脚手架工具来讲也只是停留在应用阶段，从来没有想过脚手架是如何实现的？vue init webpack 项目名称是如何通过这样的命令创建了一个项目，其最重要的模块就是今天要说的Commander。Commander模块又国外TJ大神所编写项目地址：Com

2021-05-27 10:11:23

BS结构RFID读写器web插件开发之九-----ISO15693标签操作

ISO15693标签web读写ISO15693标签介绍ISO15693协议和ISO14443A/B协议是常见的三种通信协议，其中ISO15693协议的理论读写距离≤1m，ISO14443A/B协议的理论读写距≤10cm.遵循ISO15693协议的标签常见的有ICODE1和ICODE2,TagIT等等.友我科技IC卡读卡器web插件系统对ISO15693标签开放了全部接口，可以通过javascrip

2021-05-25 09:35:47

ISO15693 javascript web

BS结构RFID读写器web插件开发之八-----DES和3DES加解密

DES和3DES加解密关于DES和3DESDES是一种标准加密算法,它使用对称密钥加密法.DES算法密钥为8字节.3DES（即TripleDES）是DES向AES过渡的加密算法,3DES算法是指使用双长度（16字节）密钥K=（KL||KR）将8字节明文数据块进行3次DES加密/解密。如下所示：Y=DES(KL[DES-1(KR[DES(KL[X])])])解密方式为：X=DES-1(KL[DES(

2021-05-24 10:16:47

javascript IC卡读卡器 web

BS结构RFID读写器web插件开发之五----电子钱包操作

IC卡电子钱包web操作普通IC卡电子钱包介绍普通IC卡电子钱包是IC卡块数据的另外一种格式,这种格式存储占用了全部16个字节,所以一旦将这个块作为电子钱包使用,则不能在这个块存储任何其他的数据.电子钱包输入和输出均为4个字节整形,不能为小数类型.如果要存储小数类型,需要放大相应倍数,使其转变为整形.电子钱包是数据存储的另外一个格式,所以在我们使用电子钱包之前,必须将其初始化为钱包.之后才能对其充

2021-05-21 09:56:56

IC卡读卡器 NFC javascript

三层优化1.加入接口建议面向接口开发：先接口-再实现类–service、dao加入接口–接口与实现类的命名规范接口：interface，起名 I实体类Service IStudentServiceIStudentDao 实现类：implements 起名实体类ServiceImpl StudentServiceImplStudentDaoImpl接口： I实体...

2021-05-20 10:49:36

JSP开发 JSP脚本

上一页 1 ··· 7 8 9 10 11 ··· 15 下一页

51CTO技术栈公众号

业务
速览

媒体

51CTO CIOAge HC3i

社区

51CTO博客鸿蒙开发者社区

教育

51CTO学堂精培企业培训 CTO训练营