首页 › aardio › 一键生成发光字插件 (一键生成模板代码)

一键生成发光字插件 (一键生成模板代码)

🏷️ aardio ✍️ 优质科技领域创作者 📅 2026-03-15T08:01:27+00:00

有些在线图文编辑器不支持直接插入代码块，但可以直接粘贴 HTML 格式的高亮代码块。

花了一点时间研究了一下各家的编辑器，规则却各不相同。有的要求代码块被包含于 <code> ... </code> 或者 <pre> <code> ... </code> </pre> , 有些要求 class 属性里包含 "code" 关键词，或者要求代码块里必须包含至少一个 <br> 。如果不符合这些要求，不是变成普通文本，就是丢失换行缩进，或者丢失颜色样式。

所以，这就难了。先得找个支持代码高亮的编辑器，仔细地选择并复制代码块，复制完还得编辑剪贴板里的 HTML 。这就不如干脆写个转换工具了。

因为浏览器操作系统剪贴板可能不太方便，下面用 aardio 写一个工具软件。

先看软件成品演示：

一键生成页面代码,一键生成代码粘贴

软件用法：

1、输入编程语言名称（支持自动完成）。

2、然后在输入框中粘贴要转换的编程代码。

3、点击「复制高亮代码块」按钮。

然后我们就可以打开在线图文编辑器直接粘贴生成的高亮代码块了。

下面是这个软件的 aardio 源代码：

import win.ui;
/*DSG{{*/
var winform = win.form(text="HTML 代码块生成工具 - 本工具使用 aardio 语言编写";right=1055;bottom=674;bgcolor=16777215)
winform.add(
button={cls="button";text="复制高亮代码块";left=633;top=609;right=1000;bottom=665;bgcolor=16777215;color=14120960;db=1;dr=1;font=LOGFONT(h=-14);note="可在网页编辑器直接粘贴";z=4};
cmbLangs={cls="combobox";left=262;top=625;right=446;bottom=651;db=1;dl=1;edge=1;items={"javascript"};mode="dropdown";z=2};
editCode={cls="edit";left=1;top=4;right=1052;bottom=599;db=1;dl=1;dr=1;dt=1;edge=1;hscroll=1;multiline=1;vscroll=1;z=5};
static={cls="static";text="请选择语言：";left=70;top=629;right=248;bottom=649;align="right";db=1;dl=1;transparent=1;z=3};
webCtrl={cls="custom";text="自定义控件";left=8;top=10;right=1048;bottom=604;db=1;dl=1;dr=1;dt=1;hide=1;z=1}
)
/*}}*/

import web.view;
var wb = web.view(winform.webCtrl);

import win.clip.html;
wb.export({ 
    onHighlight = function(html,background,foreground){
        html = `<pre class="code" style="overflow-x:auto;text-align:left;box-shadow: rgba(216, 216, 216, 0.5) 0px 0px 0px 1px inset;padding:10px;border-radius:3px;background-color:`+background+`;color:`+foreground+`;white-space:pre;word-break:break-all;display:block;font-size:14px;font-style:normal;font-variant-ligatures:normal;font-variant-caps: normal;font-family: "Consolas", Consolas, "Liberation Mono", Menlo, Courier, monospace"><code>`
            + html + `</code></pre>`;

        html,count = string.replace(html,'\n',"<br>");
        if(!count){
            html = string.replace(html,`\</code\>\</pre\>


一键生成通用高亮代码块到剪贴板，可粘贴到在线编辑器-*今条头日**





{"@context":"https://schema.org","@type":"NewsArticle","mainEntityOfPage":{"@type":"WebPage","@id":"https://www.toutiao.com/article/7152926474562044448/"},"headline":"一键生成通用高亮代码块到剪贴板，可粘贴到在线编辑器","description":"有些在线图文编辑器不支持直接插入代码块，但可以直接粘贴 HTML 格式的高亮代码块。花了一点时间研究了一下各家的编辑器，规则却各不相同。有的要求","image":["https://cdn.hasbaahbca.workers.dev/tos-cn-i-qvj2lq49k0/02d08dccbce84e92a8a9bcd01ae4adcd~noop.image?_iz=58558&from=article.pc_detail&lk3s=953192f4&x-expires=1716743207&x-signature=ZsrBTeni7XmnD%2FDVfg36nNg9Jcc%3D","https://cdn.mendezhlauren156.workers.dev/tos-cn-i-qvj2lq49k0/a497701d42114d1498580db899f681e3~noop.image?_iz=58558&from=article.pc_detail&lk3s=953192f4&x-expires=1716743207&x-signature=84Rw5eR50htT4%2BcNYc6Tdn1p86E%3D","https://cdn.havbaahvaz.workers.dev/tos-cn-i-qvj2lq49k0/8f936ebe2c034b54b29f11db50fd1002~noop.image?_iz=58558&from=article.pc_detail&lk3s=953192f4&x-expires=1716743207&x-signature=XIR%2BDSb5fn9ut1tTCdGGIkEGdbM%3D"],"datePublished":"2022-10-10T23:00:00.000Z","dateModified":"2024-05-09T22:52:15.000Z","author":{"@type":"Person","name":"aardio","url":"https://www.toutiao.com/c/user/token/MS4wLjABAAAA6V3GhZ2y8hJUJhD7Vu83IY_BSisSZR1kz54kmiG11wUQmnup_vzNnOE_w4i3vBUK/"},"publisher":{"@type":"Organization","name":"*今条头日**","logo":{"@type":"ImageObject","url":"https://lf3-static.bytednsdoc.com/obj/eden-cn/uhbfnupkbps/216.png"}}}














!function(r,e,t,n,s,a,o,i,c,l,d,p,m,f){a="precollect",o="getAttribute",i="addEventListener",(l=function(e){(d=[].slice.call(arguments)).push(Date.now(),location.href),(e==a?l.p.a:l.q).push(d)}).q=[],l.p={a:[]},r[s]=l,(p=document.createElement("script")).src=t+"?bid=toutiao_web_pc&globalName="+s,p.crossOrigin=0
window.Slardar&&window.Slardar("init",{bid:"toutiao_web_pc",pid:"news_article_detail",release:"1.0.0.2081",env:"online",sample:{sample_rate:1},plugins:{ajax:{ignoreUrls:["mcs.snssdk.com","mcs.zijieapi.com","i.snssdk.com","verify.snssdk.com","vcs.snssdk.com","mon.zijieapi.com","mon.snssdk.com"]},pageview:{routeMode:"manual"},blankScreen:{rootSelector:"#root"}}})
!function(n,t){if(n.LogAnalyticsObject=t,!n[t]){function c(){c.q.push(arguments)}c.q=c.q||[],n[t]=c}n[t].l=+new Date}(window,"collectEvent")


window.collectEvent("usePlugin","autotrack"),window.collectEvent("usePlugin","stay"),window.collectEvent("init",{app_id:24,channel:"cn",autotrack:{custom:"tea",text:!0},enable_stay_duration:!0}),window.collectEvent("config",{evtParams:{url:window.location.href,screen_width:window.screen.width,screen_height:window.screen.height,screen_inner_width:window.innerWidth,screen_inner_height:window.innerHeight}})


window.byted_acrawler&&window.byted_acrawler.init({aid:24,dfp:!0})
!function(){var a="24",r="6457";var n=function(e,t,n){if(Math.ceil(100*Math.random())


window._SdkGlueInit({self:{aid:24,pageId:6457},bdms:{aid:24,pageId:6457,paths:["/api/pc/list/feed","/api/pc/list/user/feed"]}})


window.TTGCaptcha&&window.TTGCaptcha.init({commonOptions:{aid:24,iid:"0",did:"0"}})


window.secsdk&&window.secsdk.csrf.setProtectedHost({"www.toutiao.com":{GET:[],POST:[/^\/api\/pc\/user\/fans_digg/,/^\/api\/pc\/user\/delete/,/^\/api\/pc\/user\/follow/,/^\/c\/ugc\/content\/repost/,/^\/group\/repin/,/^\/group\/unrepin/,/^\/api\/pc\/user\/stick/,/^\/api\/pc\/user\/unstick/,/^\/c\/user\/unfollow/,/^\/wenda\/v5\/interact\/followanswer/,/^\/wenda\/v5\/interact\/followquestion/,/^\/wenda\/v5\/interact\/digganswer/,/^\/wenda\/v5\/interact\/deleteanswer/,/^\/user_data\/batch_action/,/^\/action\/api\/v1\/do_action/],PUT:[],PATCH:[],DELETE:[]}})


"undefined"!=typeof window&&"serviceWorker"in navigator&&window.addEventListener("load",function(){navigator.serviceWorker.register("/sw.js").catch(function(e){window.Slardar&&window.Slardar("emit","counter",{name:"sw-register-error",value:1})})})


function gtag(){dataLayer.push(arguments)}window.dataLayer=window.dataLayer||[],gtag("js",new Date),gtag("config","G-QEHZPBE5HH")


%7B%22data%22%3A%7B%22title%22%3A%22%E4%B8%80%E9%94%AE%E7%94%9F%E6%88%90%E9%80%9A%E7%94%A8%E9%AB%98%E4%BA%AE%E4%BB%A3%E7%A0%81%E5%9D%97%E5%88%B0%E5%89%AA%E8%B4%B4%E6%9D%BF%EF%BC%8C%E5%8F%AF%E7%B2%98%E8%B4%B4%E5%88%B0%E5%9C%A8%E7%BA%BF%E7%BC%96%E8%BE%91%E5%99%A8%22%2C%22abstract%22%3A%22%E6%9C%89%E4%BA%9B%E5%9C%A8%E7%BA%BF%E5%9B%BE%E6%96%87%E7%BC%96%E8%BE%91%E5%99%A8%E4%B8%8D%E6%94%AF%E6%8C%81%E7%9B%B4%E6%8E%A5%E6%8F%92%E5%85%A5%E4%BB%A3%E7%A0%81%E5%9D%97%EF%BC%8C%E4%BD%86%E5%8F%AF%E4%BB%A5%E7%9B%B4%E6%8E%A5%E7%B2%98%E8%B4%B4%20HTML%20%E6%A0%BC%E5%BC%8F%E7%9A%84%E9%AB%98%E4%BA%AE%E4%BB%A3%E7%A0%81%E5%9D%97%E3%80%82%E8%8A%B1%E4%BA%86%E4%B8%80%E7%82%B9%E6%97%B6%E9%97%B4%E7%A0%94%E7%A9%B6%E4%BA%86%E4%B8%80%E4%B8%8B%E5%90%84%E5%AE%B6%E7%9A%84%E7%BC%96%E8%BE%91%E5%99%A8%EF%BC%8C%E8%A7%84%E5%88%99%E5%8D%B4%E5%90%84%E4%B8%8D%E7%9B%B8%E5%90%8C%E3%80%82%E6%9C%89%E7%9A%84%E8%A6%81%E6%B1%82%E4%BB%A3%E7%A0%81%E5%9D%97%E8%A2%AB%E5%8C%85%E5%90%AB%E4%BA%8E%20%26lt%3Bcode%26gt%3B%20...%20%26lt%3B%2Fcode%26gt%3B%20%E6%88%96%E8%80%85%20%26lt%3Bpre%26gt%3B%20%26lt%3Bcode%26gt%3B%20...%22%2C%22articleType%22%3A%22article%22%2C%22itemId%22%3A%227152926474562044448%22%2C%22groupId%22%3A%227152926474562044448%22%2C%22groupSource%22%3A2%2C%22isOriginal%22%3Atrue%2C%22banComment%22%3Afalse%2C%22publishTime%22%3A%222022-10-11%2007%3A00%22%2C%22source%22%3A%22aardio%22%2C%22tag%22%3A%22technique%22%2C%22mediaSite%22%3Anull%2C%22pathname%22%3A%22%2Farticle%2F7152926474562044448%2F%22%2C%22useCandle%22%3Afalse%2C%22isExclusive%22%3Afalse%2C%22favorite%22%3Afalse%2C%22relation%22%3A%7B%22isFollowing%22%3Afalse%2C%22isFollowed%22%3Afalse%7D%2C%22likeData%22%3A%7B%22userLikeStatus%22%3A0%2C%22count%22%3A55%7D%2C%22isSelf%22%3Afalse%2C%22content%22%3A%22%3Cp%20data-track%3D%5C%221%5C%22%3E%E6%9C%89%E4%BA%9B%E5%9C%A8%E7%BA%BF%E5%9B%BE%E6%96%87%E7%BC%96%E8%BE%91%E5%99%A8%E4%B8%8D%E6%94%AF%E6%8C%81%E7%9B%B4%E6%8E%A5%E6%8F%92%E5%85%A5%E4%BB%A3%E7%A0%81%E5%9D%97%EF%BC%8C%E4%BD%86%E5%8F%AF%E4%BB%A5%E7%9B%B4%E6%8E%A5%E7%B2%98%E8%B4%B4%20HTML%20%E6%A0%BC%E5%BC%8F%E7%9A%84%E9%AB%98%E4%BA%AE%E4%BB%A3%E7%A0%81%E5%9D%97%E3%80%82%3C%2Fp%3E%3Cp%20data-track%3D%5C%222%5C%22%3E%E8%8A%B1%E4%BA%86%E4%B8%80%E7%82%B9%E6%97%B6%E9%97%B4%E7%A0%94%E7%A9%B6%E4%BA%86%E4%B8%80%E4%B8%8B%E5%90%84%E5%AE%B6%E7%9A%84%E7%BC%96%E8%BE%91%E5%99%A8%EF%BC%8C%E8%A7%84%E5%88%99%E5%8D%B4%E5%90%84%E4%B8%8D%E7%9B%B8%E5%90%8C%E3%80%82%E6%9C%89%E7%9A%84%E8%A6%81%E6%B1%82%E4%BB%A3%E7%A0%81%E5%9D%97%E8%A2%AB%E5%8C%85%E5%90%AB%E4%BA%8E%20%26lt%3Bcode%26gt%3B%20...%20%26lt%3B%2Fcode%26gt%3B%20%E6%88%96%E8%80%85%20%26lt%3Bpre%26gt%3B%20%26lt%3Bcode%26gt%3B%20...%20%26lt%3B%2Fcode%26gt%3B%20%26lt%3B%2Fpre%26gt%3B%20%2C%20%E6%9C%89%E4%BA%9B%E8%A6%81%E6%B1%82%20class%20%E5%B1%9E%E6%80%A7%E9%87%8C%E5%8C%85%E5%90%AB%20%26%2334%3Bcode%26%2334%3B%20%E5%85%B3%E9%94%AE%E8%AF%8D%EF%BC%8C%E6%88%96%E8%80%85%E8%A6%81%E6%B1%82%E4%BB%A3%E7%A0%81%E5%9D%97%E9%87%8C%E5%BF%85%E9%A1%BB%E5%8C%85%E5%90%AB%E8%87%B3%E5%B0%91%E4%B8%80%E4%B8%AA%20%26lt%3Bbr%26gt%3B%20%E3%80%82%E5%A6%82%E6%9E%9C%E4%B8%8D%E7%AC%A6%E5%90%88%E8%BF%99%E4%BA%9B%E8%A6%81%E6%B1%82%EF%BC%8C%E4%B8%8D%E6%98%AF%E5%8F%98%E6%88%90%E6%99%AE%E9%80%9A%E6%96%87%E6%9C%AC%EF%BC%8C%E5%B0%B1%E6%98%AF%E4%B8%A2%E5%A4%B1%E6%8D%A2%E8%A1%8C%E7%BC%A9%E8%BF%9B%EF%BC%8C%E6%88%96%E8%80%85%E4%B8%A2%E5%A4%B1%E9%A2%9C%E8%89%B2%E6%A0%B7%E5%BC%8F%E3%80%82%3C%2Fp%3E%3Cp%20data-track%3D%5C%2229%5C%22%3E%E6%89%80%E4%BB%A5%EF%BC%8C%E8%BF%99%E5%B0%B1%E9%9A%BE%E4%BA%86%E3%80%82%E5%85%88%E5%BE%97%E6%89%BE%E4%B8%AA%E6%94%AF%E6%8C%81%E4%BB%A3%E7%A0%81%E9%AB%98%E4%BA%AE%E7%9A%84%E7%BC%96%E8%BE%91%E5%99%A8%EF%BC%8C%E4%BB%94%E7%BB%86%E5%9C%B0%E9%80%89%E6%8B%A9%E5%B9%B6%E5%A4%8D%E5%88%B6%E4%BB%A3%E7%A0%81%E5%9D%97%EF%BC%8C%E5%A4%8D%E5%88%B6%E5%AE%8C%E8%BF%98%E5%BE%97%E7%BC%96%E8%BE%91%E5%89%AA%E8%B4%B4%E6%9D%BF%E9%87%8C%E7%9A%84%20HTML%20%E3%80%82%E8%BF%99%E5%B0%B1%E4%B8%8D%E5%A6%82%E5%B9%B2%E8%84%86%E5%86%99%E4%B8%AA%E8%BD%AC%E6%8D%A2%E5%B7%A5%E5%85%B7%E4%BA%86%E3%80%82%3C%2Fp%3E%3Cp%20data-track%3D%5C%223%5C%22%3E%E5%9B%A0%E4%B8%BA%E6%B5%8F%E8%A7%88%E5%99%A8%E6%93%8D%E4%BD%9C%E7%B3%BB%E7%BB%9F%E5%89%AA%E8%B4%B4%E6%9D%BF%E5%8F%AF%E8%83%BD%E4%B8%8D%E5%A4%AA%E6%96%B9%E4%BE%BF%EF%BC%8C%E4%B8%8B%E9%9D%A2%E7%94%A8%20aardio%20%E5%86%99%E4%B8%80%E4%B8%AA%E5%B7%A5%E5%85%B7%E8%BD%AF%E4%BB%B6%E3%80%82%3C%2Fp%3E%3Cp%20data-track%3D%5C%2222%5C%22%3E%E5%85%88%E7%9C%8B%E8%BD%AF%E4%BB%B6%E6%88%90%E5%93%81%E6%BC%94%E7%A4%BA%EF%BC%9A%3C%2Fp%3E%3Cdiv%20class%3D%5C%22pgc-img%5C%22%3E%3Cimg%20src%3D%5C%22https%3A%2F%2Fp3-sign.toutiaoimg.com%2Ftos-cn-i-qvj2lq49k0%2F02d08dccbce84e92a8a9bcd01ae4adcd~noop.image%3F_iz%3D58558%26from%3Darticle.pc_detail%26lk3s%3D953192f4%26x-expires%3D1716743207%26x-signature%3DZsrBTeni7XmnD%252FDVfg36nNg9Jcc%253D%5C%22%20img_width%3D%5C%22757%5C%22%20img_height%3D%5C%22578%5C%22%20image_type%3D%5C%225%5C%22%20mime_type%3D%5C%22image%2Fgif%5C%22%20web_uri%3D%5C%22tos-cn-i-qvj2lq49k0%2F02d08dccbce84e92a8a9bcd01ae4adcd%5C%22%3E%3Cp%20class%3D%5C%22pgc-img-caption%5C%22%3E%3C%2Fp%3E%3C%2Fdiv%3E%3Cp%20data-track%3D%5C%226%5C%22%3E%E8%BD%AF%E4%BB%B6%E7%94%A8%E6%B3%95%EF%BC%9A%3C%2Fp%3E%3Cblockquote%20class%3D%5C%22pgc-blockquote-abstract%5C%22%3E%3Cp%3E1%E3%80%81%E8%BE%93%E5%85%A5%E7%BC%96%E7%A8%8B%E8%AF%AD%E8%A8%80%E5%90%8D%E7%A7%B0%EF%BC%88%E6%94%AF%E6%8C%81%E8%87%AA%E5%8A%A8%E5%AE%8C%E6%88%90%EF%BC%89%E3%80%82%3C%2Fp%3E%3Cp%20data-track%3D%5C%2211%5C%22%3E2%E3%80%81%E7%84%B6%E5%90%8E%E5%9C%A8%E8%BE%93%E5%85%A5%E6%A1%86%E4%B8%AD%E7%B2%98%E8%B4%B4%E8%A6%81%E8%BD%AC%E6%8D%A2%E7%9A%84%E7%BC%96%E7%A8%8B%E4%BB%A3%E7%A0%81%E3%80%82%3C%2Fp%3E%3Cp%20data-track%3D%5C%2212%5C%22%3E3%E3%80%81%E7%82%B9%E5%87%BB%E3%80%8C%E5%A4%8D%E5%88%B6%E9%AB%98%E4%BA%AE%E4%BB%A3%E7%A0%81%E5%9D%97%E3%80%8D%E6%8C%89%E9%92%AE%E3%80%82%3C%2Fp%3E%3C%2Fblockquote%3E%3Cp%20data-track%3D%5C%2214%5C%22%3E%E7%84%B6%E5%90%8E%E6%88%91%E4%BB%AC%E5%B0%B1%E5%8F%AF%E4%BB%A5%E6%89%93%E5%BC%80%E5%9C%A8%E7%BA%BF%E5%9B%BE%E6%96%87%E7%BC%96%E8%BE%91%E5%99%A8%E7%9B%B4%E6%8E%A5%E7%B2%98%E8%B4%B4%E7%94%9F%E6%88%90%E7%9A%84%E9%AB%98%E4%BA%AE%E4%BB%A3%E7%A0%81%E5%9D%97%E4%BA%86%E3%80%82%3C%2Fp%3E%3Cp%20data-track%3D%5C%2215%5C%22%3E%E4%B8%8B%E9%9D%A2%E6%98%AF%E8%BF%99%E4%B8%AA%E8%BD%AF%E4%BB%B6%E7%9A%84%20aardio%20%E6%BA%90%E4%BB%A3%E7%A0%81%EF%BC%9A%3C%2Fp%3E%3Cpre%3E%3Ccode%3Eimport%20win.ui%3B%5Cn%2F*DSG%7B%7B*%2F%5Cnvar%20winform%20%3D%20win.form(text%3D%26%2334%3BHTML%20%E4%BB%A3%E7%A0%81%E5%9D%97%E7%94%9F%E6%88%90%E5%B7%A5%E5%85%B7%20-%20%E6%9C%AC%E5%B7%A5%E5%85%B7%E4%BD%BF%E7%94%A8%20aardio%20%E8%AF%AD%E8%A8%80%E7%BC%96%E5%86%99%26%2334%3B%3Bright%3D1055%3Bbottom%3D674%3Bbgcolor%3D16777215)%5Cnwinform.add(%5Cnbutton%3D%7Bcls%3D%26%2334%3Bbutton%26%2334%3B%3Btext%3D%26%2334%3B%E5%A4%8D%E5%88%B6%E9%AB%98%E4%BA%AE%E4%BB%A3%E7%A0%81%E5%9D%97%26%2334%3B%3Bleft%3D633%3Btop%3D609%3Bright%3D1000%3Bbottom%3D665%3Bbgcolor%3D16777215%3Bcolor%3D14120960%3Bdb%3D1%3Bdr%3D1%3Bfont%3DLOGFONT(h%3D-14)%3Bnote%3D%26%2334%3B%E5%8F%AF%E5%9C%A8%E7%BD%91%E9%A1%B5%E7%BC%96%E8%BE%91%E5%99%A8%E7%9B%B4%E6%8E%A5%E7%B2%98%E8%B4%B4%26%2334%3B%3Bz%3D4%7D%3B%5CncmbLangs%3D%7Bcls%3D%26%2334%3Bcombobox%26%2334%3B%3Bleft%3D262%3Btop%3D625%3Bright%3D446%3Bbottom%3D651%3Bdb%3D1%3Bdl%3D1%3Bedge%3D1%3Bitems%3D%7B%26%2334%3Bjavascript%26%2334%3B%7D%3Bmode%3D%26%2334%3Bdropdown%26%2334%3B%3Bz%3D2%7D%3B%5CneditCode%3D%7Bcls%3D%26%2334%3Bedit%26%2334%3B%3Bleft%3D1%3Btop%3D4%3Bright%3D1052%3Bbottom%3D599%3Bdb%3D1%3Bdl%3D1%3Bdr%3D1%3Bdt%3D1%3Bedge%3D1%3Bhscroll%3D1%3Bmultiline%3D1%3Bvscroll%3D1%3Bz%3D5%7D%3B%5Cnstatic%3D%7Bcls%3D%26%2334%3Bstatic%26%2334%3B%3Btext%3D%26%2334%3B%E8%AF%B7%E9%80%89%E6%8B%A9%E8%AF%AD%E8%A8%80%EF%BC%9A%26%2334%3B%3Bleft%3D70%3Btop%3D629%3Bright%3D248%3Bbottom%3D649%3Balign%3D%26%2334%3Bright%26%2334%3B%3Bdb%3D1%3Bdl%3D1%3Btransparent%3D1%3Bz%3D3%7D%3B%5CnwebCtrl%3D%7Bcls%3D%26%2334%3Bcustom%26%2334%3B%3Btext%3D%26%2334%3B%E8%87%AA%E5%AE%9A%E4%B9%89%E6%8E%A7%E4%BB%B6%26%2334%3B%3Bleft%3D8%3Btop%3D10%3Bright%3D1048%3Bbottom%3D604%3Bdb%3D1%3Bdl%3D1%3Bdr%3D1%3Bdt%3D1%3Bhide%3D1%3Bz%3D1%7D%5Cn)%5Cn%2F*%7D%7D*%2F%5Cn%5Cnimport%20web.view%3B%5Cnvar%20wb%20%3D%20web.view(winform.webCtrl)%3B%5Cn%5Cnimport%20win.clip.html%3B%5Cnwb.export(%7B%20%5Cn%20%20%20%20onHighlight%20%3D%20function(html%2Cbackground%2Cforeground)%7B%5Cn%20%20%20%20%20%20%20%20html%20%3D%20%60%26lt%3Bpre%20class%3D%26%2334%3Bcode%26%2334%3B%20style%3D%26%2334%3Boverflow-x%3Aauto%3Btext-align%3Aleft%3Bbox-shadow%3A%20rgba(216%2C%20216%2C%20216%2C%200.5)%200px%200px%200px%201px%20inset%3Bpadding%3A10px%3Bborder-radius%3A3px%3Bbackground-color%3A%60%2Bbackground%2B%60%3Bcolor%3A%60%2Bforeground%2B%60%3Bwhite-space%3Apre%3Bword-break%3Abreak-all%3Bdisplay%3Ablock%3Bfont-size%3A14px%3Bfont-style%3Anormal%3Bfont-variant-ligatures%3Anormal%3Bfont-variant-caps%3A%20normal%3Bfont-family%3A%20%26%2334%3BConsolas%26%2334%3B%2C%20Consolas%2C%20%26%2334%3BLiberation%20Mono%26%2334%3B%2C%20Menlo%2C%20Courier%2C%20monospace%26%2334%3B%26gt%3B%26lt%3Bcode%26gt%3B%60%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%2B%20html%20%2B%20%60%26lt%3B%2Fcode%26gt%3B%26lt%3B%2Fpre%26gt%3B%60%3B%5Cn%5Cn%20%20%20%20%20%20%20%20html%2Ccount%20%3D%20string.replace(html%2C%26%2339%3B%5C%5Cn%26%2339%3B%2C%26%2334%3B%26lt%3Bbr%26gt%3B%26%2334%3B)%3B%5Cn%20%20%20%20%20%20%20%20if(!count)%7B%5Cn%20%20%20%20%20%20%20%20%20%20%20%20html%20%3D%20string.replace(html%2C%60%5C%5C%26lt%3B%2Fcode%5C%5C%26gt%3B%5C%5C%26lt%3B%2Fpre%5C%5C%26gt%3B%24%60%2C%60%26lt%3Bbr%26gt%3B%26lt%3B%2Fcode%26gt%3B%26lt%3B%2Fpre%26gt%3B%60)%3B%5Cn%20%20%20%20%20%20%20%20%7D%5Cn%20%20%20%20%20%20%20%20var%20cb%20%3D%20win.clip.html()%3B%5Cn%20%20%20%20%20%20%20%20cb.write(html)%3B%20%5Cn%5Cn%20%20%20%20%20%20%20%20winform.setTimeout(%20%5Cn%20%20%20%20%20%20%20%20%20%20%20%20function()%7B%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20winform.editCode.show(true)%3B%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20winform.webCtrl.show(false)%3B%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20winform.text%20%3D%20%26%2334%3BHTML%20%E4%BB%A3%E7%A0%81%E5%9D%97%E7%94%9F%E6%88%90%E5%B7%A5%E5%85%B7%20-%20%E5%B7%B2%E5%A4%8D%E5%88%B6%E9%AB%98%E4%BA%AE%E4%BB%A3%E7%A0%81%E5%9D%97%E5%88%B0%E5%89%AA%E8%B4%B4%E6%9D%BF%EF%BC%8C%E5%8F%AF%E5%9C%A8%E7%BD%91%E9%A1%B5%E7%9B%B4%E6%8E%A5%E7%B2%98%E8%B4%B4%26%2334%3B%3B%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%7D%2C1000)%3B%20%5Cn%20%20%20%20%7D%3B%5Cn%20%20%20%20setLanguages%20%3D%20function(langs)%7B%5Cn%20%20%20%20%20%20%20%20winform.languages%20%3D%20langs%3B%5Cn%20%20%20%20%7D%20%20%5Cn%7D)%5Cn%5Cn%5Cnwinform.cmbLangs.onEditChange%20%3D%20function()%7B%20%5Cn%5Cn%20%20%20%20var%20text%20%3D%20string.lower(winform.cmbLangs.text)%3B%5Cn%20%20%20%20var%20items%20%3D%20table.filter(%20winform.languages%20%3A%20%7B%7D%2C%20lambda(v)%20string.startWith(v%2Ctext)%20)%3B%20%5Cn%20%20%20%20winform.cmbLangs.autoComplete(items)%3B%20%20%5Cn%7D%5Cnwinform.cmbLangs.editBox.disableInputMethod()%3B%5Cn%5Cnimport%20web.prism%3B%5Cnimport%20wsock.tcp.asynHttpServer%3B%5Cnvar%20httpServer%20%3D%20wsock.tcp.asynHttpServer()%3B%20%5CnhttpServer.run(web.prism%2C%7B%5Cn%20%20%20%20%5B%26%2334%3B%2Findex.html%26%2334%3B%5D%20%3D%20%2F*****%5Cn%26lt%3B!DOCTYPE%20html%26gt%3B%5Cn%26lt%3Bhtml%26gt%3B%5Cn%20%20%26lt%3Bhead%26gt%3B%5Cn%20%20%20%20%26lt%3Bmeta%20charset%3D%26%2334%3BUTF-8%26%2334%3B%20%2F%26gt%3B%20%5Cn%20%20%20%20%26lt%3Blink%20href%3D%26%2334%3Bprism.css%26%2334%3B%20rel%3D%26%2334%3Bstylesheet%26%2334%3B%20%2F%26gt%3B%5Cn%20%20%26lt%3B%2Fhead%26gt%3B%5Cn%20%20%26lt%3Bbody%26gt%3B%5Cn%20%20%20%20%26lt%3Bpre%20id%3D%26%2334%3Bcode-pre%26%2334%3B%26gt%3B%26lt%3Bcode%20id%3D%26%2334%3Bcode%26%2334%3B%20class%3D%26%2334%3Blang-javascript%26%2334%3B%26gt%3B%26lt%3B%2Fcode%26gt%3B%26lt%3B%2Fpre%26gt%3B%5Cn%20%20%20%20%26lt%3Bscript%20src%3D%26%2334%3Bprism.js%26%2334%3B%26gt%3B%26lt%3B%2Fscript%26gt%3B%5Cn%20%20%20%20%26lt%3Bscript%26gt%3B%5Cn%20%20%20function%20computedColorStyle(element%2C%20options%20%3D%20%7B%7D)%20%7B%5Cn%5Cn%20%20%20%20%20%20%20%20Array.prototype.forEach.call(element.children%2Cchild%20%3D%26gt%3B%20%7B%5Cn%20%20%20%20%20%20%20%20%20%20%20%20computedColorStyle(child%2C%20options)%3B%5Cn%20%20%20%20%20%20%20%20%7D)%3B%5Cn%5Cn%20%20%20%20%20%20%20%20const%20computedStyle%20%3D%20getComputedStyle(element)%3B%5Cn%20%20%20%20%20%20%20%20element.style%5B%26%2334%3Bcolor%26%2334%3B%5D%20%3D%20computedStyle.getPropertyValue(%26%2334%3Bcolor%26%2334%3B)%3B%20%20%5Cn%20%20%20%20%7D%5Cn%5Cn%20%20%20%20highlight%20%3D%20function(code%2Clanguage)%7B%5Cn%20%20%20%20%20%20%20%20var%20html%20%3D%20Prism.highlight(code%2C%20Prism.languages%5Blanguage%5D%2C%20language)%3B%5Cn%5Cn%20%20%20%20%20%20%20%20var%20codeEle%20%3D%20document.getElementById(%26%2334%3Bcode%26%2334%3B)%3B%5Cn%20%20%20%20%20%20%20%20codeEle.innerHTML%20%3D%20html%3B%5Cn%20%20%20%20%20%20%20%20computedColorStyle(codeEle)%3B%5Cn%5Cn%20%20%20%20%20%20%20%20const%20computedStyle%20%3D%20getComputedStyle(codeEle)%3B%20%20%5Cn%20%20%20%20%20%20%20%20onHighlight(codeEle.innerHTML%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%2CgetComputedStyle(document.getElementById(%26%2334%3Bcode-pre%26%2334%3B)).getPropertyValue(%26%2334%3Bbackground-color%26%2334%3B)%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%2CcomputedStyle.getPropertyValue(%26%2334%3Bcolor%26%2334%3B))%3B%5Cn%20%20%20%20%7D%5Cn%5Cn%20%20%20%20setLanguages(%20Object.keys(Prism.languages)%20)%3B%5Cn%20%20%20%20%26lt%3B%2Fscript%26gt%3B%5Cn%20%20%26lt%3B%2Fbody%26gt%3B%20%5Cn%26lt%3B%2Fhtml%26gt%3B%20%5Cn%20%20%20%20*****%2F%5Cn%7D)%3B%5Cn%5Cnwb.go(%20httpServer.getUrl(%26%2334%3B%2Findex.html%26%2334%3B))%3B%5Cn%5Cnwinform.button.oncommand%20%3D%20function(id%2Cevent)%7B%5Cn%20%20%20%20winform.text%20%3D%20%26%2334%3BHTML%20%E4%BB%A3%E7%A0%81%E5%9D%97%E7%94%9F%E6%88%90%E5%B7%A5%E5%85%B7%20-%20%E6%9C%AC%E5%B7%A5%E5%85%B7%E4%BD%BF%E7%94%A8%20aardio%20%E8%AF%AD%E8%A8%80%E7%BC%96%E5%86%99%26%2334%3B%5Cn%20%20%20%20winform.editCode.show(false)%3B%5Cn%20%20%20%20winform.webCtrl.show(true)%3B%5Cn%5Cn%20%20%20%20wb.xcall(%26%2334%3Bhighlight%26%2334%3B%2Cwinform.editCode.text%2Cwinform.cmbLangs.text)%3B%5Cn%7D%5Cn%5Cn%5Cnwinform.show()%3B%5Cnwin.loopMessage()%3B%3C%2Fcode%3E%3C%2Fpre%3E%3Cp%20data-track%3D%5C%2218%5C%22%3E%E6%89%93%E5%BC%80%20aardio%20%E5%88%9B%E5%BB%BA%E5%B7%A5%E7%A8%8B%EF%BC%8C%E7%84%B6%E5%90%8E%E5%A4%8D%E5%88%B6%E7%B2%98%E8%B4%B4%E4%B8%8A%E9%9D%A2%E7%9A%84%E4%BB%A3%E7%A0%81%E5%88%B0%20main.aardio%20%E9%87%8C%E9%9D%A2%E5%B0%B1%E5%8F%AF%E4%BB%A5%E7%9B%B4%E6%8E%A5%E8%BF%90%E8%A1%8C%EF%BC%8C%E6%88%96%E7%94%9F%E6%88%90%E7%8B%AC%E7%AB%8B%20EXE%20%E6%96%87%E4%BB%B6%EF%BC%9A%3C%2Fp%3E%3Cdiv%20class%3D%5C%22pgc-img%5C%22%3E%3Cimg%20src%3D%5C%22https%3A%2F%2Fp3-sign.toutiaoimg.com%2Ftos-cn-i-qvj2lq49k0%2Fa497701d42114d1498580db899f681e3~noop.image%3F_iz%3D58558%26from%3Darticle.pc_detail%26lk3s%3D953192f4%26x-expires%3D1716743207%26x-signature%3D84Rw5eR50htT4%252BcNYc6Tdn1p86E%253D%5C%22%20img_width%3D%5C%221148%5C%22%20img_height%3D%5C%22675%5C%22%20image_type%3D%5C%221%5C%22%20mime_type%3D%5C%22image%2Fpng%5C%22%20web_uri%3D%5C%22tos-cn-i-qvj2lq49k0%2Fa497701d42114d1498580db899f681e3%5C%22%3E%3Cp%20class%3D%5C%22pgc-img-caption%5C%22%3E%3C%2Fp%3E%3C%2Fdiv%3E%3Cp%20data-track%3D%5C%2230%5C%22%3E%E8%BF%99%E4%B8%AA%E8%BD%AF%E4%BB%B6%E7%9A%84%E5%8E%9F%E7%90%86%EF%BC%9A%3C%2Fp%3E%3Cp%20data-track%3D%5C%2224%5C%22%3E1%E3%80%81%E9%A6%96%E5%85%88%E9%80%9A%E8%BF%87%20WebView2%20%E8%B0%83%E7%94%A8%20Prism.js%20%E9%AB%98%E4%BA%AE%E4%BB%A3%E7%A0%81%E3%80%82%E4%B8%BA%E4%BA%86%E5%8F%AF%E4%BB%A5%E5%86%85%E5%AD%98%E5%8A%A0%E8%BD%BD%20Prism.js%20%EF%BC%88%20%E6%94%AF%E6%8C%81%E7%94%9F%E6%88%90%E7%8B%AC%E7%AB%8B%20EXE%20%EF%BC%89%EF%BC%8C%E6%88%91%E5%86%99%E4%BA%86%E4%B8%80%E4%B8%AA%20aardio%20%E6%89%A9%E5%B1%95%E5%BA%93%20web.prism%20%E3%80%82%E5%85%B3%E4%BA%8E%20WebView2%20%E8%AF%B7%E5%8F%82%E8%80%83%EF%BC%9A%3Ca%20class%3D%5C%22pgc-link%5C%22%20data-content%3D%5C%22mp%5C%22%20data-source%3D%5C%22innerLink%5C%22%20href%3D%5C%22https%3A%2F%2Fwww.toutiao.com%2Fi7138285629548528139%2F%3Fgroup_id%3D7138285629548528139%5C%22%20rel%3D%5C%22noopener%20noreferrer%20noopener%20noreferrer%5C%22%20target%3D%5C%22_blank%5C%22%3E%E6%94%BE%E5%BC%83%20Electron%EF%BC%8C%E6%8B%A5%E6%8A%B1%20WebView2%EF%BC%81JavaScript%20%E5%BF%AB%E9%80%9F%E5%BC%80%E5%8F%91%E7%8B%AC%E7%AB%8B%20EXE%20%E7%A8%8B%E5%BA%8F%3C%2Fa%3E%3C%2Fp%3E%3Cp%20data-track%3D%5C%2225%5C%22%3E2%E3%80%81%E5%9B%A0%E4%B8%BA%20Prism.js%20%E7%94%9F%E6%88%90%E7%9A%84%20HTML%20%E4%BB%A3%E7%A0%81%E5%9D%97%E9%83%BD%E6%98%AF%E4%BD%BF%E7%94%A8%20class%20%E5%B1%9E%E6%80%A7%E6%8C%87%E5%AE%9A%E6%A0%B7%E5%BC%8F%EF%BC%8C%E6%89%80%E4%BB%A5%E6%88%91%E4%BB%AC%E9%9C%80%E8%A6%81%E8%B0%83%E7%94%A8%20getComputedStyle%20%E8%8E%B7%E5%8F%96%E6%9C%80%E7%BB%88%E6%B8%B2%E6%9F%93%E7%9A%84%E5%AD%97%E4%BD%93%E9%A2%9C%E8%89%B2%E5%B1%9E%E6%80%A7%E3%80%82%3C%2Fp%3E%3Cp%20data-track%3D%5C%2226%5C%22%3E3%E3%80%81%E6%9C%80%E5%90%8E%E5%9C%A8%20JavaScript%20%E9%87%8C%E8%B0%83%E7%94%A8%20aardio%20%E5%87%BD%E6%95%B0%E5%A4%84%E7%90%86%E7%94%9F%E6%88%90%E7%9A%84%20HTML%20%E4%BB%A3%E7%A0%81%E5%9D%97%EF%BC%8Caardio%20%E7%9A%84%E4%BB%BB%E5%8A%A1%E6%98%AF%E5%B0%86%20HTML%20%E4%BF%AE%E6%94%B9%E4%B8%BA%E6%9B%B4%E5%90%88%E9%80%82%E7%9B%B4%E6%8E%A5%E7%B2%98%E8%B4%B4%E7%9A%84%E6%A0%BC%E5%BC%8F%EF%BC%8C%E5%B9%B6%E5%B0%BD%E5%8F%AF%E8%83%BD%E5%9C%B0%E5%A4%84%E7%90%86%E5%90%84%E5%9B%BE%E6%96%87%E7%BC%96%E8%BE%91%E5%99%A8%E7%9A%84%E5%85%BC%E5%AE%B9%E9%97%AE%E9%A2%98%E3%80%82%E7%84%B6%E5%90%8E%E8%B0%83%E7%94%A8%20win.clip.html%20%E5%B0%86%E5%A4%84%E7%90%86%E5%A5%BD%E7%9A%84%20HTML%20%E5%A4%8D%E5%88%B6%E5%88%B0%E7%B3%BB%E7%BB%9F%E5%89%AA%E8%B4%B4%E6%9D%BF%EF%BC%9A%3C%2Fp%3E%3Cpre%3E%3Ccode%3Eimport%20win.clip.html%3B%5Cn%5Cnvar%20cb%20%3D%20win.clip.html()%3B%5Cncb.write(html)%3B%20%3C%2Fcode%3E%3C%2Fpre%3E%3Cp%20data-track%3D%5C%2227%5C%22%3E%E7%84%B6%E5%90%8E%E5%8F%AA%E8%A6%81%E6%84%89%E5%BF%AB%E5%9C%B0%E7%B2%98%E8%B4%B4%E4%BB%A3%E7%A0%81%E5%9D%97%E5%B0%B1%E5%8F%AF%E4%BB%A5%E3%80%82%3C%2Fp%3E%3Cp%20data-track%3D%5C%2223%5C%22%3E%E5%A6%82%E6%9E%9C%E6%98%AF%20aardio%20%E4%BB%A3%E7%A0%81%E4%B8%8D%E9%9C%80%E8%A6%81%E7%94%A8%E8%BF%99%E4%B8%AA%E5%B7%A5%E5%85%B7%EF%BC%8C%E5%9C%A8%20aardio%20%E7%BC%96%E8%BE%91%E5%99%A8%E9%87%8C%E5%8F%B3%E9%94%AE%E7%9B%B4%E6%8E%A5%E7%82%B9%E3%80%8E%20%E5%A4%8D%E5%88%B6%E5%85%A8%E9%83%A8%E5%88%B0%20HTML%20%E4%BB%A3%E7%A0%81%E5%9D%97%20%E3%80%8F%E5%B0%B1%E5%8F%AF%E4%BB%A5%E4%BA%86%EF%BC%9A%3C%2Fp%3E%3Cdiv%20class%3D%5C%22pgc-img%5C%22%3E%3Cimg%20src%3D%5C%22https%3A%2F%2Fp3-sign.toutiaoimg.com%2Ftos-cn-i-qvj2lq49k0%2F8f936ebe2c034b54b29f11db50fd1002~noop.image%3F_iz%3D58558%26from%3Darticle.pc_detail%26lk3s%3D953192f4%26x-expires%3D1716743207%26x-signature%3DXIR%252BDSb5fn9ut1tTCdGGIkEGdbM%253D%5C%22%20img_width%3D%5C%22683%5C%22%20img_height%3D%5C%22396%5C%22%20image_type%3D%5C%225%5C%22%20mime_type%3D%5C%22image%2Fgif%5C%22%20web_uri%3D%5C%22tos-cn-i-qvj2lq49k0%2F8f936ebe2c034b54b29f11db50fd1002%5C%22%3E%3Cp%20class%3D%5C%22pgc-img-caption%5C%22%3E%3C%2Fp%3E%3C%2Fdiv%3E%22%2C%22imageList%22%3A%5B%22https%3A%2F%2Fp3-sign.toutiaoimg.com%2Ftos-cn-i-qvj2lq49k0%2F02d08dccbce84e92a8a9bcd01ae4adcd~noop.image%3F_iz%3D58558%26from%3Darticle.pc_detail%26lk3s%3D953192f4%26x-expires%3D1716743207%26x-signature%3DZsrBTeni7XmnD%252FDVfg36nNg9Jcc%253D%22%2C%22https%3A%2F%2Fp3-sign.toutiaoimg.com%2Ftos-cn-i-qvj2lq49k0%2Fa497701d42114d1498580db899f681e3~noop.image%3F_iz%3D58558%26from%3Darticle.pc_detail%26lk3s%3D953192f4%26x-expires%3D1716743207%26x-signature%3D84Rw5eR50htT4%252BcNYc6Tdn1p86E%253D%22%2C%22https%3A%2F%2Fp3-sign.toutiaoimg.com%2Ftos-cn-i-qvj2lq49k0%2F8f936ebe2c034b54b29f11db50fd1002~noop.image%3F_iz%3D58558%26from%3Darticle.pc_detail%26lk3s%3D953192f4%26x-expires%3D1716743207%26x-signature%3DXIR%252BDSb5fn9ut1tTCdGGIkEGdbM%253D%22%5D%2C%22mediaInfo%22%3A%7B%22userId%22%3A%22MS4wLjABAAAA6V3GhZ2y8hJUJhD7Vu83IY_BSisSZR1kz54kmiG11wUQmnup_vzNnOE_w4i3vBUK%22%2C%22unsafeUserId%22%3A%222145852757384983%22%2C%22name%22%3A%22aardio%22%2C%22avatarUrl%22%3A%22https%3A%2F%2Fsf1-cdn-tos.toutiaostatic.com%2Fimg%2Fuser-avatar%2Fc08c4d2a5e908a519d6968fa48679896~300x300.image%22%2C%22description%22%3A%22%E6%A1%8C%E9%9D%A2%E8%BD%AF%E4%BB%B6%E5%BF%AB%E9%80%9F%E5%BC%80%E5%8F%91%E5%B7%A5%E5%85%B7%E3%80%82%E5%B0%8F%E8%BD%BB%E5%BF%AB%EF%BC%8C%E6%B0%B8%E4%B9%85%E5%85%8D%E8%B4%B9%E3%80%82%E4%B8%B0%E5%AF%8C%E7%9A%84%E5%BC%80%E6%BA%90%E5%BA%93%EF%BC%8C%E5%85%BC%E5%AE%B9%E5%A4%A7%E9%87%8F%E7%AC%AC%E4%B8%89%E6%96%B9%E8%AF%AD%E8%A8%80%E3%80%82%22%2C%22userVerified%22%3A1%2C%22userAuthInfo%22%3A%7B%22auth_type%22%3A%220%22%2C%22auth_info%22%3A%22%E4%BC%98%E8%B4%A8%E7%A7%91%E6%8A%80%E9%A2%86%E5%9F%9F%E5%88%9B%E4%BD%9C%E8%80%85%22%2C%22other_auth%22%3A%7B%22interest%22%3A%22%E4%BC%98%E8%B4%A8%E7%A7%91%E6%8A%80%E9%A2%86%E5%9F%9F%E5%88%9B%E4%BD%9C%E8%80%85%22%7D%7D%7D%2C%22seoTDK%22%3A%7B%22title%22%3A%22%E4%B8%80%E9%94%AE%E7%94%9F%E6%88%90%E9%80%9A%E7%94%A8%E9%AB%98%E4%BA%AE%E4%BB%A3%E7%A0%81%E5%9D%97%E5%88%B0%E5%89%AA%E8%B4%B4%E6%9D%BF%EF%BC%8C%E5%8F%AF%E7%B2%98%E8%B4%B4%E5%88%B0%E5%9C%A8%E7%BA%BF%E7%BC%96%E8%BE%91%E5%99%A8-%E4%BB%8A%E6%97%A5%E5%A4%B4%E6%9D%A1%22%2C%22description%22%3A%22%E6%9C%89%E4%BA%9B%E5%9C%A8%E7%BA%BF%E5%9B%BE%E6%96%87%E7%BC%96%E8%BE%91%E5%99%A8%E4%B8%8D%E6%94%AF%E6%8C%81%E7%9B%B4%E6%8E%A5%E6%8F%92%E5%85%A5%E4%BB%A3%E7%A0%81%E5%9D%97%EF%BC%8C%E4%BD%86%E5%8F%AF%E4%BB%A5%E7%9B%B4%E6%8E%A5%E7%B2%98%E8%B4%B4%20HTML%20%E6%A0%BC%E5%BC%8F%E7%9A%84%E9%AB%98%E4%BA%AE%E4%BB%A3%E7%A0%81%E5%9D%97%E3%80%82%E8%8A%B1%E4%BA%86%E4%B8%80%E7%82%B9%E6%97%B6%E9%97%B4%E7%A0%94%E7%A9%B6%E4%BA%86%E4%B8%80%E4%B8%8B%E5%90%84%E5%AE%B6%E7%9A%84%E7%BC%96%E8%BE%91%E5%99%A8%EF%BC%8C%E8%A7%84%E5%88%99%E5%8D%B4%E5%90%84%E4%B8%8D%E7%9B%B8%E5%90%8C%E3%80%82%E6%9C%89%E7%9A%84%E8%A6%81%E6%B1%82%22%2C%22keywords%22%3A%22HTML%2C%E8%BD%AF%E4%BB%B6%2CJavaScript%2CWord%2C%E6%B5%8F%E8%A7%88%E5%99%A8%2C0verflow%2C%E7%BC%96%E7%A8%8B%E8%AF%AD%E8%A8%80%2C%E6%93%8D%E4%BD%9C%E7%B3%BB%E7%BB%9F%22%2C%22publishTimestamp%22%3A%221665442800%22%2C%22modifiedTimestamp%22%3A%221715295135%22%7D%2C%22cover%22%3A%22https%3A%2F%2Fp26-sign.toutiaoimg.com%2Ftos-cn-i-qvj2lq49k0%2Fa497701d42114d1498580db899f681e3~tplv-tt-shrink-asy2%3A640%3A0%3A5aS05p2hQGFhcmRpbw%3D%3D.jpeg%3F_iz%3D58558%26from%3Darticle.pc_detail%26lk3s%3D953192f4%26x-expires%3D1716743207%26x-signature%3DUwcFEZOYl6dFHruzVJ0OuvLvhko%253D%22%2C%22logId%22%3A%2220240520010647D8737E594219C8D449FE%22%2C%22sylpageConfig%22%3A%7B%22card%22%3A%7B%22id%22%3A%22%22%7D%7D%2C%22identity%22%3A%7B%22web_id%22%3A%227366012242279794187%22%2C%22user_is_login%22%3Afalse%7D%2C%22abtestInfo%22%3A%7B%22rsp_type%22%3A5%2C%22version_name%22%3A%228315611%2C8918418%2C4938400%2C8813385%22%2C%22parameters%22%3A%7B%22filter%22%3A%7B%22debug_enable_pc_small_video%22%3Afalse%2C%22enable_pc_small_video%22%3Atrue%7D%2C%22home_nav_conf%22%3A%7B%22dcd_out%22%3A1%7D%2C%22login_authentication%22%3A%7B%22open%22%3Atrue%7D%2C%22optimus%22%3A%7B%22rule_rank_rules%22%3A%22ranking_rule_list%20%7B%5Cn%20%20id%3A%201221233%5Cn%20priority%3A%200%5Cn%20tags%3A%20%5C%2212123%5C%22%5Cn%20%20enabled%3A%20true%5Cn%20%20type%3A%20CARD%5Cn%20%20card_rule%20%7B%5Cn%20size%3A%202%5Cn%20type%3A%20SAME_SLOT%20%5Cn%7D%5Cn%20%7D%5Cn%20ranking_rule_list%20%7B%5Cn%20%20id%3A%2020458%5Cn%20%20priority%3A%203%5Cn%20%20enabled%3A%20true%5Cn%20%20category%3A%2020458%5Cn%20%20type%3A%20WINDOW%5Cn%20%20window_rule%20%7B%5Cn%20%20%20%20type%3A%20SLIDE%5Cn%20%20%20%20size%3A%203%5Cn%20%20%20%20max%3A%201%5Cn%20%20%7D%5Cn%7D%5Cn%20ranking_rule_list%20%7B%5Cn%20%20id%3A%201111024%5Cn%20priority%3A%200%5Cn%20tags%3A%20%5C%2211024%5C%22%5Cn%20%20enabled%3A%20true%5Cn%20%20type%3A%20CARD%5Cn%20%20card_rule%20%7B%5Cn%20size%3A%206%5Cn%20type%3A%20SAME_SLOT%20%5Cn%7D%5Cn%20%7D%22%7D%2C%22page_upgrade%22%3A%7B%22new_profile%22%3Atrue%2C%22video_double_column%22%3Atrue%7D%2C%22recall%22%3A%7B%22debug_filter_reason_list%22%3A%5B%5D%2C%22debug_recall_reason_list%22%3A%5B70%2C71%2C72%2C73%2C80%2C83%5D%2C%22enable_debug_filter_reason%22%3Atrue%2C%22enable_debug_recall_reason%22%3Atrue%2C%22friend_feed%22%3A%7B%22control_nums%22%3A1500%2C%22count%22%3A1000%2C%22enable%22%3Atrue%2C%22enable_cpp_friend_feed%22%3Atrue%2C%22enable_friend_feed_container_filter%22%3Atrue%2C%22enable_group_status_filter%22%3Atrue%2C%22params%22%3A%7B%7D%2C%22top_k%22%3A10%2C%22use_new_friend_recall%22%3Atrue%2C%22valid_group_source%22%3A%5B2%2C5%2C15%2C23%2C16%2C19%2C21%2C132%5D%2C%22weight%22%3A20%7D%7D%2C%22seraph%22%3A%7B%22rule_rank_rules_pc_small%22%3A%22%5Cn%20%20%20%20%20%20ranking_rule_list%20%7B%5Cn%20%20%20%20%20%20%20%20%20id%3A%2022124%20%5Cn%20%20%20%20%20%20%20%20%20priority%3A%200%20%5Cn%20%20%20%20%20%20%20%20%20tags%3A%20%5C%2222124%5C%22%20%5Cn%20%20%20%20%20%20%20%20%20enabled%3A%20true%20%5Cn%20%20%20%20%20%20%20%20%20type%3A%20CARD%20%5Cn%20%20%20%20%20%20%20%20%20card_rule%20%7B%20%5Cn%20%20%20%20%20%20%20%20%20size%3A%206%20%5Cn%20%20%20%20%20%20%20%20%20num_cards%3A%201%5Cn%20%20%20%20%20%20%20%20%20type%3A%20SAME_SLOT%20%5Cn%20%20%20%20%20%20%20%7D%5Cn%20%20%20%20%20%20%7D%5Cn%20%20%20%20%22%2C%22rule_rank_rules_pc_small_window%22%3A%22%5Cn%20%20%20%20%20%20ranking_rule_list%20%7B%5Cn%20%20%20%20id%3A%20222124%5Cn%20%20%20priority%3A%200%5Cn%20%20%20tags%3A%20%5C%2222124%5C%22%5Cn%20%20%20%20enabled%3A%20false%5Cn%20%20%20%20type%3A%20WINDOW%5Cn%20%20%20%20window_rule%20%7B%5Cn%20%20%20type%3A%20SLIDE%20%5Cn%20%20%20size%3A%2012%20%5Cn%20%20%20max%3A%206%20%5Cn%20%20%20%7D%5Cn%20%20%20%7D%22%7D%2C%22small_sort%22%3A%7B%22enable_filter_zhanwai%22%3Atrue%2C%22filter_genre_plog%22%3Afalse%2C%22filter_genre_small%22%3Afalse%2C%22skip_small_app_version_filter%22%3Afalse%2C%22skip_small_genre_filter%22%3Afalse%7D%2C%22sort%22%3A%7B%22allowed_ticai%22%3A%5B%22forum_post%22%2C%22pgc_text%22%2C%22pgc_video%22%2C%22short_video%22%5D%2C%22enable_optimus_gen_pc_mv_card%22%3Atrue%2C%22enable_optimus_gen_pc_sv_card%22%3Atrue%2C%22enable_pc_skip_app_smallvideo_card%22%3Atrue%7D%2C%22stream%22%3A%7B%22disable_related%22%3Atrue%2C%22enable_ads_sdk%22%3Atrue%2C%22enable_ads_sdk_pack%22%3Atrue%7D%2C%22ugc_sort%22%3A%7B%22expore_smallvideo%22%3Atrue%7D%2C%22video_channel%22%3A%7B%22use_feed%22%3A1%2C%22rank%22%3A5%7D%7D%2C%22env_flag%22%3A0%2C%22ns_parameters%22%3A%7B%7D%2C%22object_parameters%22%3A%7B%7D%7D%2C%22localCityInfo%22%3A%7B%22name%22%3A%22%E8%A5%84%E9%98%B3%22%2C%22code%22%3A%22420600%22%2C%22channelId%22%3A3202181326%7D%2C%22voteLink%22%3A%5B%7B%22keyword%22%3A%22calculate%20field%20pivot%20table%22%2C%22type%22%3A%22%22%2C%22url%22%3A%22https%3A%2F%2Fwww.larksuite.com%2Fhc%2Fen-US%2Farticles%2F394302268326-use-calculated-fields-in-pivot-tables%22%7D%2C%7B%22keyword%22%3A%22pivot%20table%20field%22%2C%22type%22%3A%22%22%2C%22url%22%3A%22https%3A%2F%2Fwww.larksuite.com%2Fhc%2Fen-US%2Farticles%2F060547918490-use-fields-in-pivot-tables%22%7D%2C%7B%22keyword%22%3A%22%E8%AE%A2%E9%98%85%20%E5%8F%B7%22%2C%22type%22%3A%22%22%2C%22url%22%3A%22https%3A%2F%2Fwww.larksuite.com%2Fhc%2Fzh-CN%2Farticles%2F360048487858%22%7D%2C%7B%22keyword%22%3A%22excel%20formulas%20cheat%20sheet%22%2C%22type%22%3A%22%22%2C%22url%22%3A%22https%3A%2F%2Fwww.larksuite.com%2Fen_us%2Fblog%2Flark-ultimate-excel-formulas-cheat-sheet-alternative-free-template%22%7D%2C%7B%22keyword%22%3A%22%E6%9B%B9%E6%93%8D%E4%BC%A0%E8%B1%AA%E5%8D%8E%E7%89%88%22%2C%22type%22%3A%22%22%2C%22url%22%3A%22https%3A%2F%2Fwww.doubao.com%2Ftraffic%2Fask%2F95682%22%7D%2C%7B%22keyword%22%3A%22%E6%88%91%E4%BB%AC%E6%B2%A1%E6%9C%89%E7%BF%85%E8%86%80%22%2C%22type%22%3A%22%22%2C%22url%22%3A%22https%3A%2F%2Fwww.doubao.com%2Ftraffic%2Fask%2F47794%22%7D%2C%7B%22keyword%22%3A%22%E7%BB%88%E6%9E%81%E6%B8%B8%E6%88%8F%22%2C%22type%22%3A%22%22%2C%22url%22%3A%22https%3A%2F%2Fwww.doubao.com%2Ftraffic%2Fask%2F97109%22%7D%2C%7B%22keyword%22%3A%22%E5%B8%83%E5%8A%A0%E7%BB%BC%E5%90%88%E5%BE%81%E8%B6%85%E5%A3%B0%E8%A7%86%E9%A2%91%E8%AE%B2%E8%A7%A3%22%2C%22type%22%3A%22%22%2C%22url%22%3A%22https%3A%2F%2Fwww.doubao.com%2Ftraffic%2Fask%2F17639%22%7D%2C%7B%22keyword%22%3A%22%E6%B3%A2%E5%A3%AB%E9%A1%BF%E9%BE%99%E8%99%BE%E5%81%9A%E6%B3%95%22%2C%22type%22%3A%22%22%2C%22url%22%3A%22https%3A%2F%2Fwww.doubao.com%2Ftraffic%2Fask%2F93259%22%7D%2C%7B%22keyword%22%3A%22%E5%B1%B1%E4%B8%9C%E5%B0%8F%E5%A7%A8%E5%AD%90%E6%90%9E%E7%AC%91%E8%A7%86%E9%A2%91%22%2C%22type%22%3A%22%22%2C%22url%22%3A%22https%3A%2F%2Fwww.doubao.com%2Ftraffic%2Fask%2F137317%22%7D%5D%2C%22grSensitive%22%3Afalse%2C%22showResearch%22%3Afalse%2C%22blockVisibility%22%3A%7B%22hotBoard%22%3Atrue%2C%22hotVideo%22%3Atrue%2C%22relatedRecommend%22%3Atrue%7D%2C%22isGreyTheme%22%3Afalse%2C%22searchBot%22%3Anull%7D%7D


,`<br></code></pre>`);
        }
        var cb = win.clip.html();
        cb.write(html); 

        winform.setTimeout( 
            function(){
                winform.editCode.show(true);
                winform.webCtrl.show(false);
                winform.text = "HTML 代码块生成工具 - 已复制高亮代码块到剪贴板，可在网页直接粘贴";
            },1000); 
    };
    setLanguages = function(langs){
        winform.languages = langs;
    }  
})


winform.cmbLangs.onEditChange = function(){ 

    var text = string.lower(winform.cmbLangs.text);
    var items = table.filter( winform.languages : {}, lambda(v) string.startWith(v,text) ); 
    winform.cmbLangs.autoComplete(items);  
}
winform.cmbLangs.editBox.disableInputMethod();

import web.prism;
import wsock.tcp.asynHttpServer;
var httpServer = wsock.tcp.asynHttpServer(); 
httpServer.run(web.prism,{
    ["/index.html"] = /*****
<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8" /> 
    <link href="prism.css" rel="stylesheet" />
  </head>
  <body>
    <pre id="code-pre"><code id="code" class="lang-javascript"></code></pre>
    <script src="prism.js"></script>
    <script>
   function computedColorStyle(element, options = {}) {

        Array.prototype.forEach.call(element.children,child => {
            computedColorStyle(child, options);
        });

        const computedStyle = getComputedStyle(element);
        element.style["color"] = computedStyle.getPropertyValue("color");  
    }

    highlight = function(code,language){
        var html = Prism.highlight(code, Prism.languages[language], language);

        var codeEle = document.getElementById("code");
        codeEle.innerHTML = html;
        computedColorStyle(codeEle);

        const computedStyle = getComputedStyle(codeEle);  
        onHighlight(codeEle.innerHTML
            ,getComputedStyle(document.getElementById("code-pre")).getPropertyValue("background-color")
            ,computedStyle.getPropertyValue("color"));
    }

    setLanguages( Object.keys(Prism.languages) );
    </script>
  </body> 
</html> 
    *****/
});

wb.go( httpServer.getUrl("/index.html"));

winform.button.oncommand = function(id,event){
    winform.text = "HTML 代码块生成工具 - 本工具使用 aardio 语言编写"
    winform.editCode.show(false);
    winform.webCtrl.show(true);

    wb.xcall("highlight",winform.editCode.text,winform.cmbLangs.text);
}


winform.show();
win.loopMessage();

打开 aardio 创建工程，然后复制粘贴上面的代码到 main.aardio 里面就可以直接运行，或生成独立 EXE 文件：

一键生成页面代码,一键生成代码粘贴

这个软件的原理：

1、首先通过 WebView2 调用 Prism.js 高亮代码。为了可以内存加载 Prism.js （ 支持生成独立 EXE ），我写了一个 aardio 扩展库 web.prism 。关于 WebView2 请参考：放弃 Electron，拥抱 WebView2！JavaScript 快速开发独立 EXE 程序

2、因为 Prism.js 生成的 HTML 代码块都是使用 class 属性指定样式，所以我们需要调用 getComputedStyle 获取最终渲染的字体颜色属性。

3、最后在 JavaScript 里调用 aardio 函数处理生成的 HTML 代码块，aardio 的任务是将 HTML 修改为更合适直接粘贴的格式，并尽可能地处理各图文编辑器的兼容问题。然后调用 win.clip.html 将处理好的 HTML 复制到系统剪贴板：

import win.clip.html;

var cb = win.clip.html();
cb.write(html);

然后只要愉快地粘贴代码块就可以。

如果是 aardio 代码不需要用这个工具，在 aardio 编辑器里右键直接点『 复制全部到 HTML 代码块 』就可以了：

一键生成页面代码,一键生成代码粘贴