如何使用HTML、CSS和JavaScript构建单词搜索游戏

The Wordle phenomenon from a few years back inspired developers worldwide to create their own word games. It inspired me to conceive and build a game, too. ‘Word Zearch’ combines elements of...

《Word Zearch》是一款结合Boggle和单词搜索的网页游戏，玩家在7x7字母网格中寻找单词。教程涵盖Trie数据结构、递归算法和用户界面设计，目标是在最短时间内找到尽可能多的有效单词。

Boggle Trie Word Zearch css html javascript 单词搜索游戏

原文英文，约1400词，阅读约需5分钟。发表于：。

阅读原文

分享给好友

HTML新search元素,h1规则要变,声明式Shadow DOM

介绍3个与HTML相关的新变化与新特性，分别是新支持的search元素，h1规则变化与声明式Shadow DOM，希望可以帮到大家的学习。

文章介绍了HTML的新特性，包括Chrome和Safari支持的<search>元素、h1元素样式规则的变化，以及声明式Shadow DOM的使用。<search>元素用于定义搜索区域，h1元素不再因嵌套而降级，Shadow DOM可无JavaScript定义，提升组件的隔离性。

<search>元素 HTML Shadow DOM h1元素 shadow 组件隔离

原文中文，约2300字，阅读约需6分钟。发表于：。

阅读原文

分享给好友

使用CSS通过HTML重写器设置元素顺序

After shipping my work transforming HTML with Netlify’s edge functions I realized I have a little bug: the order of the icons specified in the URL doesn’t match the order in which they are...

作者通过使用CSS的order属性，结合URL中的ID顺序，成功调整了Netlify边缘函数处理HTML时图标的显示顺序，解决了图标顺序与URL不匹配的问题，而无需修改源HTML。

CSS HTML Netlify 图标顺序边缘函数

原文英文，约500词，阅读约需2分钟。发表于：。

阅读原文

分享给好友

通过Netlify边缘功能转换HTML

I’ve long wanted the ability to create custom collections of icons from my icon gallery. Today I can browse collections of icons that share pre-defined metadata (e.g. “Show me all icons tagged as...

我创建了一个新的页面（/lookup），允许用户根据图标ID生成自定义图标集合。通过JavaScript和Netlify的边缘功能，我动态处理请求，过滤所需图标，提升性能。切换主机时不会影响URL结构。

JavaScript Netlify html 图标ID 性能自定义图标

原文英文，约700词，阅读约需3分钟。发表于：。

阅读原文

分享给好友

HTML 规范变更：对属性中的 < 和 > 进行转义

此更改仅修改了在序列化过程中将 HTML 片段转换回字符串表示的方式。影响仅限于访问 innerHTML 或 outerHTML 属性或对元素调用 getHTML() 方法的情况。这些操作会采用现有的 DOM 结构，并生成文本 HTML 表示法。

HTML规范将于2025年5月20日更新，开始对属性中的<和>进行转义，以防止突变XSS漏洞。此变更影响使用innerHTML和outerHTML提取属性的代码，但不影响DOM API的使用。使用Chromium和Firefox的用户将于2025年6月24日体验此更改。

DOM API HTML规范 XSS漏洞 html innerHTML 转义

原文中文，约2200字，阅读约需6分钟。发表于：。

阅读原文

分享给好友

QQ 聊天记录 MHT 文件转 HTML

写在前面虽然最近博客没有更新，但博主一直在写一些回忆性的文章（都存放在某个赛博空间里）。最近突然回想起一些往事，想翻看以前的聊天记录。尽管那时明月在，曾照彩云归，好在博主没有删掉数据的习惯，消息记录几乎都还保留着。虽然，我们的对话仅仅持续了一年半。

博主回忆聊天记录，尝试将QQ的MHT文件转换为HTML格式。由于浏览器兼容性问题，最终通过提取HTML部分和转存图片成功实现转换，并分享了相关的Python代码。

HTML MHT Python 聊天记录转换

原文中文，约5300字，阅读约需13分钟。发表于：。

阅读原文

分享给好友

我构建了一个 API，可以从任何网站或 HTML 中提取 SEO 元数据、图片、JS 和 CSS — 可用于审计、自动化或分析 🔍

Hey devs 👋 As someone building tools for digital marketers and devs, I was constantly hacking together different libraries to extract SEO and asset data from web pages. Most tools were either...

SmartWeb Web Scraper API 是一个快速的服务器端 API，能够从任何网站 URL 或原始 HTML 中提取 SEO 信息和页面资产（如 JS、CSS、图片），适用于 SEO 审计、博客发布验证和竞争对手分析等场景。

API SEO Web Scraper css html js 数据提取竞争分析