把 网页代码 嵌入到 单片机程序中 2 日志2024/7/26

之前不是说把 网页代码 嵌入到 单片机程序中 嘛!

目录

之前不是说把 网页代码 嵌入到 单片机程序中 嘛!

 修改vs的tasks.json配置

 然后 测试

结果是正常的,可以编译了

但是:当我把我都html代码都写上去之后

还是会报错!!!

内部被检测到了,没辙,只有手动更新了小工具代码

界面展示

​编辑功能:两种转换格式分别对应不同用法,一键复制到剪切板(免去全选操作) 


本来可以 const char* html=R"( )";

这样写的话.这样中间可以直接放 网页代码 而不用特别的去转义!

但是我一直没有用上,一直用的前面我发布的 把 网页代码 嵌入到 单片机程序中,2024/7/25 17:33-CSDN博客

今天就挺莫名其妙的了解到了真相.............gcc版本过低

 之后我又发现..................它这个版本支持!

GCC 10.3.0默认支持C++11,显式指定标准总是个好习惯。在你的编译命令中加入-std=c++11

 修改vs的tasks.json配置

   {"version": "2.0.0","tasks": [{"label": "build","type": "shell","command": "g++","args": ["-std=c++11", //明显的指定支持c++11 风格"${file}","-o","${fileDirname}/${fileBasenameNoExtension}"],"group": {"kind": "build","isDefault": true}}]}

 然后 测试

const char* html=R"(<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body></body>
</html>)";

结果是正常的,可以编译了

但是:当我把我都html代码都写上去之后

还是会报错!!!

内部被检测到了,没辙,只有手动更新了小工具代码

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><title>Document</title><style>body {padding: 0;margin: 0;box-sizing: border-box;}.container {overflow-x: hidden;width: 100vw;height: 90vh;background-color: bisque;}#box {width: 100vw;height: 10vh;position: relative;display: flex;justify-content: center;z-index: 2;}.button-style {bottom: 0;background-color: rgb(2, 120, 159);width: 100%;height: 10vh;}#but1 {margin-right: 5%;}</style>
</head><body><div id="daima" class="container" contenteditable="true"></div><div id="box"><button id="but" class="button-style" onclick="zy()">转义符模式:const char* html="转义后代码";</button><button id="but2" class="button-style" onclick="zy2()">双引号变单引号模式:const char* html=R"(处理后代码)";</button><button id="but3" class="button-style" onclick="zy3()">复制到剪切板</button></div><script>var hq;var typea = false;function zy() {if (!typea) {hq = document.getElementById('daima').textContent;//获取代码typea = true;}document.getElementById('but').style.backgroundColor = 'red';setTimeout(function () {document.getElementById('but').style.backgroundColor = 'rgb(2, 120, 159)';}, 200);let zh = hq.replace(/"/g, '\\"');//查找字符串 hq 中的所有双引号,并将它们替换为转义后的双引号(即 \")。document.getElementById('daima').innerText = zh;}function zy2() {if (!typea) {hq = document.getElementById('daima').textContent;//获取代码typea = true;}document.getElementById('but2').style.backgroundColor = 'red';setTimeout(function () {document.getElementById('but2').style.backgroundColor = 'rgb(2, 120, 159)';}, 200);let zh = hq.replace(/"/g, "'");//查找字符串 hq 中的所有双引号,并将它们替换为转义后的单引号。document.getElementById('daima').innerText = zh;}function zy3() {var newdaima=document.getElementById('daima').innerText;var but3=document.getElementById('but3');but3.style.backgroundColor = 'red';setTimeout(function () {document.getElementById('but3').style.backgroundColor = 'rgb(2, 120, 159)';}, 200); navigator.clipboard.writeText(newdaima).then(function () {document.getElementById('daima').innerText="";hq="";typea=false; alert("复制成功!");}, function (err) {alert("复制失败!");});}</script>
</body></html>

界面展示

功能:两种转换格式分别对应不同用法,一键复制到剪切板(免去全选操作) 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/385508.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Python3网络爬虫开发实战(2)爬虫基础库

文章目录 一、urllib1. urlparse 实现 URL 的识别和分段2. urlunparse 用于构造 URL3. urljoin 用于两个链接的拼接4. urlencode 将 params 字典序列化为 params 字符串5. parse_qs 和 parse_qsl 用于将 params 字符串反序列化为 params 字典或列表6. quote 和 unquote 对 URL的…

JAVAWeb实战(前端篇)

项目实战一 0.项目结构 1.创建vue3项目&#xff0c;并导入所需的依赖 npm install vue-router npm install axios npm install pinia npm install vue 2.定义路由&#xff0c;axios&#xff0c;pinia相关的对象 文件&#xff08;.js&#xff09; 2.1路由(.js) import {cre…

HarmonyOS Next 省市区级联(三级联动)筛选框

效果图 完整代码 实例对象 export class ProvinceBean {id?: stringpid?: stringisSelect?: booleandeep?: objectextName?: stringchildren?: ProvinceBean[] }级联代码 import { MMKV } from tencent/mmkv/src/main/ets/utils/MMKV import { ProvinceBean } from ..…

nodeselector

1.概述 在创建pod资源是&#xff0c;k8s集群系统会给我们将pod资源随机分配到不同服务器上。我们通过配置nodeSelector可以将pod资源指定到拥有某个标签的服务器上 使用nodeselector前我们要先给每个节点打上标签&#xff0c;在编辑pod资源的时候选择该标签 2.示例 给节点打标…

数据科学统计面试问题 -40问

前 40 名数据科学统计面试问题 一、介绍 正如 Josh Wills 曾经说过的那样&#xff0c;“数据科学家是一个比任何程序员都更擅长统计、比任何统计学家都更擅长编程的人”。统计学是数据科学中处理数据及其分析的基本工具。它提供了工具和方法&#xff0c;可帮助数据科学家获得…

初涉JVM

JVM 字节码、类的生命周期、内存区域、垃圾回收 JVM主要功能&#xff1a; 解释运行&#xff08;翻译字节码&#xff09;内存管理&#xff08;GC&#xff09;即使编译&#xff08;Just - In - Time&#xff0c; JIT&#xff09; 将短时间内常使用到的字节码翻译成机器码存储在内…

【Gin】智慧架构的巧妙砌筑:Gin框架中控制反转与依赖注入模式的精华解析与应用实战(下)

【Gin】智慧架构的巧妙砌筑&#xff1a;Gin框架中控制反转与依赖注入模式的精华解析与应用实战(下) 大家好 我是寸铁&#x1f44a; 【Gin】智慧架构的巧妙砌筑&#xff1a;Gin框架中控制反转与依赖注入模式的精华解析与应用实战(下)✨ 喜欢的小伙伴可以点点关注 &#x1f49d; …

uboot的mmc partconf命令

文章目录 命令格式参数解释具体命令解释总结 mmc partconf 是一个用于配置 MMC (MultiMediaCard) 分区的 U-Boot 命令。具体来说&#xff0c;这个命令允许你设置或读取 MMC 卡的分区配置参数。让我们详细解释一下 mmc partconf 0 0 1 0 命令的含义。 命令格式 mmc partconf &…

【网络安全】子域名模糊测试实现RCE

未经许可&#xff0c;不得转载。 文章目录 正文总结 正文 在之前测试一个私人项目时&#xff0c;我报告了admin.Target.com上的Auth Bypass漏洞&#xff0c;这将导致SQLI&RCE &#xff0c;该漏洞在报告后仅一天就被修复。 现在重拾该应用程序&#xff0c;对子域进行模糊测…

探索 Blockly:自定义积木实例

3.实例 3.1.基础块 无输入 , 无输出 3.1.1.json var textOneJson {"type": "sql_test_text_one","message0": " one ","colour": 30,"tooltip": 无输入 , 无输出 };javascriptGenerator.forBlock[sql_test_te…

c语言第四天笔记

关于 混合操作&#xff0c;不同计算结果推理 第一种编译结果&#xff1a; int i 5; int sum (i) (i) 6 7 13 第二种编译结果&#xff1a; int i 5; int sum (i) (i) 6 7 7 7 前面的7是因为后面i的变化被影响后&#xff0c;重新赋值 14 第一种编译结果&#xff…

后端解决跨域(Cross-Origin Resource Sharing)(三种方式)

注解CrossOrigin 控制层的类上或者方法上加注解CrossOrigin 实现接口并重写方法 Configuration public class CorsConfig implements WebMvcConfigurer {Overridepublic void addCorsMappings(CorsRegistry registry) {// 设置允许跨域的路径registry.addMapping("/**&qu…

springboot配置文件如何读取pom.xml的值

比如想读取profile.active的值&#xff0c;默认属性为pro 在maven中加入以下插件&#xff1a; <plugin><groupId>org.apache.maven.plugins</groupId><artifactId>maven-resources-plugin</artifactId><version>3.2.0</version>&l…

Servlet详解(超详细)

Servlet详解 文章目录 Servlet详解一、基本概念二、Servlet的使用1、创建Servlet类2、配置Servleta. 使用web.xml配置b. 使用注解配置 3、部署Web应用4、处理HTTP请求和生成响应5、处理表单数据HTML表单Servlet 6、管理会话 三、servlet生命周期1、加载和实例化2、初始化3、 请…

pinia安装及简介

pinia简介 基本特点 轻量级&#xff1a;Pinia相比于传统的Vuex&#xff0c;体积更小&#xff0c;性能更好&#xff0c;只有大约1KB左右。 简化API&#xff1a;Pinia简化了状态管理库的使用方法&#xff0c;抛弃了Vuex中的mutations&#xff0c;只保留了state、getters和actions…

科普文:docker基础概念、软件安装和常用命令

docker基本概念 一 容器的概念 1. 什么是容器&#xff1a;容器是在隔离的环境里面运行的一个进程&#xff0c;这个隔离的环境有自己的系统目录文件&#xff0c;有自己的ip地址&#xff0c;主机名等。也可以说&#xff1a;容器是一种轻量级虚拟化的技术。 2. 容器相对于kvm虚…

基于Golang+Vue3快速搭建的博客系统

WANLI 博客系统 项目介绍 基于vue3和gin框架开发的前后端分离个人博客系统&#xff0c;包含md格式的文本编辑展示&#xff0c;点赞评论收藏&#xff0c;新闻热点&#xff0c;匿名聊天室&#xff0c;文章搜索等功能。 项目在线访问&#xff1a;http://bloggo.chat/ 访客账号…

SMU Summer 2024 Contest Round 7

Bouquet 思路&#xff1a; 总的方案数就是C(n,1)C(n,2) . . . . C(n,n) &#xff1b;然后不符合的方案数为C(n,a)C(n,b); 两者相减就是答案&#xff1b;因为算组合数时&#xff0c;数据非常大&#xff0c;所以要用到lucas定理来计算组合数的大小&#xff1b; 当同余定理用…

C#使用Clipper2进行多边形合并、相交、相减、异或的示例

Clipper2库介绍 开源库介绍&#xff1a; Clipper2在Github上的地址&#xff1a;https://github.com/AngusJohnson/Clipper2 Clipper2库对简单和复杂多边形执行交集&#xff08;Intersection&#xff09;、并集&#xff08;Union&#xff09;、差分&#xff08;Difference&…

Python安装

download 1、下载 后直接安装 2、cmd运行命令 python