当前位置： 首页 > news >正文

html5新增特性

news 2026/2/11 0:09:53

对于这行代码，要写在html页面的最前端：

<!DOCTYPE html>

为什么要写在前面？

这是声明，是html5的新特性

对于html4来说，它有三种声明格式，而html5只需要统一声明，用来告诉浏览器文档使用哪一种HTML或者XHYML规范的。

语义化标签

新增<header>,<nav>,<section>,<article>,<aside>,<footer>标签

更好的描述和组织网页内容，使搜索引擎和浏览器可以更好的理解和处理页面结构，爬虫可以爬取更多有效信息。

增强型表单

新的表单类型
  • 邮箱验证——<input type="email">
  • 数值输入——<input type="number" min="9" max="12">
  • 文件导入——<input type="file" id="myFile" multiple>
  • 颜色选择——<input type="color">
  • 图片按钮——<input type="image" src="#" width=750 alt="">
  • 搜索框——<input type="search">
  • 手机号输入——<input type="tel">
  • 选择日期——<input type="date">，<input type="datetime-local">
  • 网址输入框——<input type="url">
新的表单属性
  • placeholder——文本占位符，提示信息
  • required——这个属性的值为bool，默认是true，输入不能为空
  • autofocus——自动聚焦到需要填写的textarea
  • autocomplete——属性有两个值，应该是on（默认），另一个是off。提示已经写过的信息（要和name="username"一起用，不然不生效）
  • min，max——限定输入的最少字数和最多字数，以字符个数计数

视频和音频

audio，video audio 和 video标签都很容易输出音频或视频流，提供便利的获取文件信息的API

Canvas绘图

提供一个通过JavaScript和HTML的canvas元素来绘制图形的方式。可以用于动画，数据可视化，图片编辑等

SVG绘图

用xml描述2d图形的语言，xml用来传输和存储数据

SVG比canvas绘图好用，SVG不容易失帧，更稳定。它比较容易编辑，只需要从描述中移除元素就可以了

地理位置

可以识别定位，并且与别人共享地理信息

获取地理位置：通过ip地址；电脑上的位置信息定位

拖放API

这只元素为可拖放，默认属性是false

<img draggable = "true">

设置了之后用setData()或者ondragstart

WebStorage

HTML4中用cookie，在用户端保存用户数据。但是他的存储内存不大，而且是携带在http请求头中，造成资源浪费，操作cookie麻烦。

在HTML5用WebStorage在客户端本地保存用户数据

WebWorker

js是单线程执行模式，所有任务只能在一个线程上执行，一次只做一件事情。

现在的计算机大多数是多核的，不能发挥CPU计算的价值。

而WebWorker为js创造了多线程环境，js在主线执行，new一个子线程在后台执行，worker完成计算的任务给主线程，主线程中的代码执行会导致浏览器响应阻塞，而子线程代码执行不会。主线程和子线程两者互补干扰，独立执行。

主流浏览器对WebWorker兼容性不高

WebSocket

WebSocket是HTML5开始提供的一种在单个 TCP 连接上进行全双工通讯的协议。

在WebSocket API中，浏览器和服务器只需要做一个握手的动作，然后，浏览器和服务器之间就形成了一条快速通道。两者之间就直接可以数据互相传送。浏览器通过 JavaScript 向服务器发出建立 WebSocket 连接的请求，连接建立以后，客户端和服务器端就可以通过 TCP 连接直接交换数据。当你获取 Web Socket 连接后，你可以通过 send() 方法来向服务器发送数据，并通过 onmessage 事件来接收服务器返回的数据。WebSocket 协议本质上是一个基于 TCP 的协议。为了建立一个 WebSocket 连接，客户端浏览器首先要向服务器发起一个 HTTP 请求，这个请求和通常的 HTTP 请求不同，包含了一些附加头信息，其中附加头信息"Upgrade: WebSocket"表明这是一个申请协议升级的 HTTP 请求，服务器端解析这些附加的头信息然后产生应答信息返回给客户端，客户端和服务器端的 WebSocket 连接就建立起来了，双方就可以通过这个连接通道自由的传递信息，并且这个连接会持续存在直到客户端或者服务器端的某一方主动的关闭连接。

相关文章：

html5新增特性

对于这行代码&#xff0c;要写在html页面的最前端&#xff1a; <!DOCTYPE html> 为什么要写在前面&#xff1f; 这是声明&#xff0c;是html5的新特性 对于html4来说&#xff0c;它有三种声明格式&#xff0c;而html5只需要统一声明&#xff0c;用来告诉浏览器文档使用…...

编程日记 2023/12/19 3:00:52

4、APScheduler: 详解Scheduler种类用法、常见错误与解决方法【Python3测试任务管理总结】

调度器（Scheduler）是将其他组件绑在一起的关键。通常在应用程序中只运行一个调度器。应用程序开发者通常不直接处理作业存储（job stores）、执行器（executors）或触发器（triggers）。相反，调度器提供了适当的接口来处理所有这些。通过调度器配置作业存储和执行器，以及添…...

编程日记 2023/12/19 2:59:50

微服务实战系列之ZooKeeper（实践篇）

前言 关于ZooKeeper&#xff0c;博主已完整的通过庖丁解牛式的“解法”&#xff0c;完成了概述。我想掌握了这些基础原理和概念后&#xff0c;工作的问题自然迎刃而解&#xff0c;甚至offer也可能手到擒来&#xff0c;真实一举两得&#xff0c;美极了。 为了更有直观的体验&a…...

编程日记 2023/12/19 2:58:49

C++ 开发中为什么要使用继承

为何继承 实验介绍 继承是 C++ 中的特性之一，使用继承能够有效减轻工作量，使得开发更加高效。 知识点 什么是继承为何继承继承的内容权限关键字什么是继承 生活中继承是指孩子继承父亲的财产等。C++ 使用了这一思想，却又与生活中的继承不一样。 在使用继承时，派生类是…...

编程日记 2023/12/19 2:48:41

2020蓝桥杯c组纸张大小

题目名字 纸张大小 题目链接 题意 给一张纸&#xff0c;通过不断折叠&#xff0c;求最终长宽&#xff0c;给十个数字&#xff0c;输入哪个数字就求哪次折叠的长宽&#xff0c;其实就是&#xff0c;每次折叠后长度的一半变为宽度&#xff0c;原来的宽度变成长度 思路 因为数字…...

编程日记 2023/12/19 2:47:41

【Image】图像处理

计算机视觉 CV Perception 如自动驾驶领域。 只要是从所谓的图像当中去抽取信息的过程&#xff0c;我们都叫做Perception。 视觉检测可以涵盖二维检测&#xff0c;如车辆、人和信号灯的检测。另外&#xff0c;还可以控制三维信息&#xff0c;直接在三维空间中操作数据。 SL…...

编程日记 2023/12/19 2:46:40

JAVA对文档加密

当 Word 文档中包含无法公开的机密信息时&#xff0c;我们可以对其进行加密&#xff0c;使其在没有密码的情况下无法打开。本文将向您介绍如何使用 Spire.Doc for Java 加密 Word 文档和移除 Word 密码保护。 加密 Word 文档删除 Word 密码保护 安装 Spire.Doc for Java 首先…...

编程日记 2023/12/19 2:43:37

EmbedAI：一个可以上传文件训练自己ChatGPT的AI工具，妈妈再也不用担心我的GPT不会回答问题

功能介绍&#xff1a; 个性化定制&#xff1a;提供灵活的训练选项&#xff0c;用户能够通过文件、网站、Notion文档甚至YouTube等多种数据源对ChatGPT进行训练&#xff0c;以满足不同领域和需求的个性化定制。广泛应用场景&#xff1a;ChatGPT支持多种用例&#xff0c;包括智能…...

编程日记 2023/12/19 2:42:36

runCatching异常捕获onSuccess/onFailure返回函数，Kotlin

runCatching异常捕获onSuccess/onFailure返回函数&#xff0c;Kotlin fun test(a: Int, b: Int) {runCatching {a / b}.onSuccess {println("onSuccess: $it")return ok(it)}.onFailure {println("onFailure: $it")return fail(it)} }fun ok(o: Any) {prin…...

编程日记 2023/12/19 2:40:34

IDEA报错处理

问题1 IDEA 新建 Maven 项目没有文件结构 pom 文件为空 将JDK换成1.8后解决。 网络说法&#xff1a;别用 java18&#xff0c;换成 java17 或者 java1.8 都可以&#xff0c;因为 java18 不是 LTS 版本&#xff0c;有着各种各样的问题。。...

编程日记 2023/12/19 2:39:33

使用动画曲线编辑器打造炫酷的3D可视化ACE

前言 在制作3D可视化看板时&#xff0c;除了精细的模型结构外&#xff0c;炫酷的动画效果也是必不可少的。无论是复杂的还是简单的动画效果&#xff0c;要实现100%的自然平滑都是具有挑战性的工作。这涉及到物理引擎的计算和对动画效果的数学建模分析。一般来说&#xff0c;只…...

编程日记 2023/12/19 2:36:29

使用 React 和 ECharts 创建地球模拟扩散和飞线效果

在本博客中&#xff0c;我们将学习如何使用 React 和 ECharts 创建一个酷炫的地球模拟扩散效果。我们将使用 ECharts 作为可视化库&#xff0c;以及 React 来构建我们的应用。地球贴图在文章的结尾。 最终效果 准备工作 首先&#xff0c;确保你已经安装了 React&#xff0c;并…...

编程日记 2023/12/19 2:35:28

http状态码(一)400报错

一 400报错汇总 ① 综述 一、4xx状态码报错说明&#xff1a; 客户端行为导致的报错二、通用的4xxHTTP报错1) 4002) 4013) 4034) 4045) 405 --> 不允许方法&#xff0c;可能跨域或者nginx限制请求方法6) 4087) 4138) 419三、ngin自身定义的4xx报错495、496、497、498、4…...

编程日记 2023/12/19 2:32:26

【深度学习目标检测】五、基于深度学习的安全帽识别（python，目标检测）

深度学习目标检测方法则是利用深度神经网络模型进行目标检测&#xff0c;主要有以下几种&#xff1a; R-CNN系列&#xff1a;包括R-CNN、Fast R-CNN、Faster R-CNN等&#xff0c;通过候选区域法生成候选目标区域&#xff0c;然后使用卷积神经网络提取特征&#xff0c;并通过分类…...

编程日记 2023/12/19 2:31:25

芒果RT-DETR改进实验：深度集成版目标检测 RT-DETR 热力图来了！支持自定义数据集训练出来的模型

💡该教程为改进RT-DETR指南，属于《芒果书》📚系列，包含大量的原创改进方式🚀 💡🚀🚀🚀内含改进源代码 按步骤操作运行改进后的代码即可💡更方便的统计更多实验数据，方便写作 芒果RT-DETR改进实验：深度集成版目标检测 RT-DETR 热力图来了！支持自定义数据集…...

编程日记 2023/12/19 2:29:23

c语言实验八

实验1&#xff1a;在主函数中输入num个字符串&#xff0c;写一个函数&#xff0c;从传入的num个字符串中找出最长的一个字符串&#xff0c;并通过形参指针max传回该串地址&#xff0c;在主函数中输出。&#xff08;注意&#xff1a;用****作为结束输入的标志。&#xff09; #i…...

编程日记 2023/12/19 2:23:17

ArcGIS Pro SDK文件选择对话框

文件保存对话框 // 获取默认数据库var gdbPath Project.Current.DefaultGeodatabasePath;//设置文件的保存路径SaveItemDialog saveLayerFileDialog new SaveItemDialog(){Title "Save Layer File",OverwritePrompt true,//获取或设置当同名文件已存在时是否出现…...

编程日记 2023/12/19 2:21:15

ACT、NAT、NATPT和EASY-IP

目录 一、ACL 1.ACL 2.ACL的两种应用匹配机制 3.ACL的基本类型 4.ACL命令操作 5.ACL实验&#xff1a; 4.ACL的应用原则&#xff1a; 5.匹配原则&#xff1a; 二、NAT 1.NAT的原理及作用&#xff1a; 2.NAT分类 3.NAT配置 三、EASY-ip实验 四、NATPT 五、通配符 …...

编程日记 2023/12/19 2:11:06

HTML实现每天单词积累

注册页面 <!DOCTYPE html> <html> <head><meta charset"UTF-8"><title>注册</title><style>body {font-family: Arial, sans-serif;background-color: #f5f5f5;}form {max-width: 500px;margin: 50px auto;padding: 40px…...

编程日记 2023/12/19 2:08:04

【ECMAScript笔记二】运算符分类，流程控制（顺序结构、分支结构、循环结构）

文章目录 4 运算符4.1 算术运算符4.2 递增和递减运算符4.3 比较运算符4.4 逻辑运算符4.5 赋值运算符4.6 运算优先级 5 流程控制5.1 顺序结构5.2 分支结构5.2.1 if 语句5.2.2 switch 语句 5.3 循环结构5.3.1 for循环5.3.2 while循环5.3.3 do while循环5.3.4 continue和break 5.4…...

编程日记 2023/12/19 2:06:02

装饰模式（Decorator Pattern）重构java邮件发奖系统实战

前言 现在我们有个如下的需求&#xff0c;设计一个邮件发奖的小系统&#xff0c; 需求 1.数据验证 → 2. 敏感信息加密 → 3. 日志记录 → 4. 实际发送邮件 装饰器模式&#xff08;Decorator Pattern&#xff09;允许向一个现有的对象添加新的功能&#xff0c;同时又不改变其…...

编程新知 2026/2/8 4:37:00

ES6从入门到精通：前言

ES6简介 ES6&#xff08;ECMAScript 2015&#xff09;是JavaScript语言的重大更新&#xff0c;引入了许多新特性&#xff0c;包括语法糖、新数据类型、模块化支持等&#xff0c;显著提升了开发效率和代码可维护性。 核心知识点概览 变量声明 let 和 const 取代 var&#xf…...

编程新知 2025/8/18 16:42:44

ssc377d修改flash分区大小

1、flash的分区默认分配16M、 / # df -h Filesystem Size Used Available Use% Mounted on /dev/root 1.9M 1.9M 0 100% / /dev/mtdblock4 3.0M...

编程新知 2025/12/21 20:15:17

聊聊 Pulsar：Producer 源码解析

一、前言 Apache Pulsar 是一个企业级的开源分布式消息传递平台&#xff0c;以其高性能、可扩展性和存储计算分离架构在消息队列和流处理领域独树一帜。在 Pulsar 的核心架构中&#xff0c;Producer&#xff08;生产者&#xff09; 是连接客户端应用与消息队列的第一步。生产者…...

编程新知 2026/2/5 21:34:41

生成 Git SSH 证书

&#x1f511; 1. ​​生成 SSH 密钥对​​ 在终端&#xff08;Windows 使用 Git Bash&#xff0c;Mac/Linux 使用 Terminal&#xff09;执行命令&#xff1a; ssh-keygen -t rsa -b 4096 -C "your_emailexample.com" ​​参数说明​​&#xff1a; -t rsa&#x…...

编程新知 2025/9/18 11:31:13

Java线上CPU飙高问题排查全指南

一、引言 在Java应用的线上运行环境中&#xff0c;CPU飙高是一个常见且棘手的性能问题。当系统出现CPU飙高时&#xff0c;通常会导致应用响应缓慢&#xff0c;甚至服务不可用&#xff0c;严重影响用户体验和业务运行。因此&#xff0c;掌握一套科学有效的CPU飙高问题排查方法&…...

编程新知 2025/11/2 5:30:15

佰力博科技与您探讨热释电测量的几种方法

热释电的测量主要涉及热释电系数的测定&#xff0c;这是表征热释电材料性能的重要参数。热释电系数的测量方法主要包括静态法、动态法和积分电荷法。其中&#xff0c;积分电荷法最为常用&#xff0c;其原理是通过测量在电容器上积累的热释电电荷&#xff0c;从而确定热释电系数…...

编程新知 2026/1/23 11:53:19

【分享】推荐一些办公小工具

1、PDF 在线转换 https://smallpdf.com/cn/pdf-tools 推荐理由&#xff1a;大部分的转换软件需要收费&#xff0c;要么功能不齐全&#xff0c;而开会员又用不了几次浪费钱&#xff0c;借用别人的又不安全。 这个网站它不需要登录或下载安装。而且提供的免费功能就能满足日常…...

编程新知 2026/1/25 14:40:59

无人机侦测与反制技术的进展与应用

国家电网无人机侦测与反制技术的进展与应用 引言 随着无人机&#xff08;无人驾驶飞行器&#xff0c;UAV&#xff09;技术的快速发展&#xff0c;其在商业、娱乐和军事领域的广泛应用带来了新的安全挑战。特别是对于关键基础设施如电力系统&#xff0c;无人机的“黑飞”&…...

编程新知 2026/1/26 6:01:03

作为测试我们应该关注redis哪些方面

1、功能测试 数据结构操作&#xff1a;验证字符串、列表、哈希、集合和有序的基本操作是否正确 持久化&#xff1a;测试aof和aof持久化机制&#xff0c;确保数据在开启后正确恢复。 事务&#xff1a;检查事务的原子性和回滚机制。 发布订阅&#xff1a;确保消息正确传递。 2、性…...

编程新知 2025/11/1 2:00:51