html文本代码编辑器(简单、快捷,可内网运行)

418次阅读
没有评论

共计 1411 个字符,预计需要花费 4 分钟才能阅读完成。

html 文本代码编辑器(简单、快捷,可内网运行)
html 文本代码编辑器(简单、快捷,可内网运行)
功能说明
行号显示:左侧实时显示行号,并与编辑器内容同步滚动
文件打开:点击 ” 打开文件 ” 按钮选择本地文件,或支持拖放文件到编辑器打开
支持.txt、.html、.js、.css、.json、.md 等格式

文件保存:点击 ” 保存文件 ” 将当前内容保存到本地
其他功能:
暗色 / 亮色模式切换
清空编辑器内容
实时统计字数和行数

语法高亮功能
使用了 highlight.js 库提供语法高亮
支持多种编程语言:HTML、CSS、JavaScript、Python、Java、C++、PHP、JSON、XML、SQL、YAML、Markdown 等
可以通过工具栏下拉菜单选择语言
打开文件时会根据文件扩展名自动检测语言

代码注释功能
使用 Ctrl+/ 组合键注释 / 取消注释代码

支持全屏:在工具栏右侧添加了全屏按钮
全屏样式:为全屏模式添加了专门的 CSS 样式
F11 快捷键:支持代码编辑区域按 F11 键进入 / 退出全屏

关键代码

// Tab 键处理函数
function handleTabKey(e) {
        // 如果按下的不是 Tab 键,不处理
        if (e.key !== 'Tab') return;

        e.preventDefault(); // 阻止默认的 Tab 行为(焦点切换)const start = textEditor.selectionStart;
        const end = textEditor.selectionEnd;
        const value = textEditor.value;

        // 获取缩进字符串
        let indentStr;
        if (tabSizeSelect.value === 'tab') {indentStr = '\t'; // 使用制表符} else {indentStr = ' '.repeat(parseInt(tabSizeSelect.value)); // 使用空格
        }
        ...
// 处理全屏状态变化
function handleFullscreenChange() {
        const fullscreenElement = document.fullscreenElement || 
                                                         document.mozFullScreenElement || 
                                                         document.webkitFullscreenElement ||
                                                         document.msFullscreenElement;

        isFullscreen = !!fullscreenElement;

        if (isFullscreen) {
                // 进入全屏模式
                editorContainer.classList.add('fullscreen');
                document.body.classList.add('fullscreen-mode');
                fullscreenBtn.innerHTML = ' 退出全屏';
                fullscreenBtn.style.backgroundColor = '#e74c3c';
                fullscreenStatus.textContent = '全屏';

                // 显示提示
                const originalHTML = fullscreenBtn.innerHTML;
                fullscreenBtn.innerHTML = ' 已进入全屏';
                setTimeout(() => {fullscreenBtn.innerHTML = originalHTML;}, 1500);
                ...
  下载声明: 本站部分资源来自于网络收集,若侵犯了你的隐私或版权,请及时联系我们删除有关信息。
本站提供的一切软件、教程和内容信息仅限用于学习和研究目的;不得将上述内容用于商业或者非法用途,否则,一切后果请用户自负。本站信息来自网络,版权争议与本站无关。您必须在下载后的 24 个小时之内,从您的电脑或手机中彻底删除上述内容。如果您喜欢该程序,请支持正版,购买注册,得到更好的正版服务。如有侵权请邮件 QQ 邮箱:suyanw520@163.com 与我们联系处理。敬请谅解!

正文完
 0
suyan
版权声明:本站原创文章,由 suyan 于2025-12-18发表,共计1411字。
转载说明:转载本网站任何内容,请按照转载方式正确书写本站原文地址。本站提供的一切软件、教程和内容信息仅限用于学习和研究目的;不得将上述内容用于商业或者非法用途,否则,一切后果请用户自负。本站信息来自网络,版权争议与本站无关。您必须在下载后的24个小时之内,从您的电脑或手机中彻底删除上述内容。如果您喜欢该程序,请支持正版,购买注册,得到更好的正版服务。如有侵权请邮件QQ邮箱:suyanw520@163.com 与我们联系处理。敬请谅解!
评论(没有评论)
验证码