Function convertMarkdownToHTML

notes.js:1191–1278

(markdown)

    // Markdown 转 HTML 函数
    function convertMarkdownToHTML(markdown) {
        if (!markdown) return '';
        
        let html = markdown;
        
        // 先处理代码块，避免其中的特殊字符被转义
        const codeBlocks = [];
        html = html.replace(/```([\s\S]*?)```/g, (match, code) => {
            const index = codeBlocks.length;
            codeBlocks.push(code);
            return `__CODE_BLOCK_${index}__`;
        });
        
        const inlineCodes = [];
        html = html.replace(/`([^`]+)`/g, (match, code) => {
            const index = inlineCodes.length;
            inlineCodes.push(code);
            return `__INLINE_CODE_${index}__`;
        });
        
        // 处理图片和链接（在转义之前）
        // 在图片容器后面补一个换行符，确保插入后换行
        html = html.replace(/!\[([^\]]*)\]\(([^)]+)\)/g, '<div class="nsn-resizable-img-container" contenteditable="false" style="display: inline-block; position: relative; border: 1px dashed transparent; margin: 4px;"><img src="$2" alt="$1" style="max-width: 300px; height: auto; display: block; border-radius: 6px; box-shadow: 0 2px 8px rgba(0,0,0,0.1); border: 1px solid #e5e7eb;"><div class="nsn-resize-handle" style="position: absolute; bottom: -3px; right: -3px; width: 8px; height: 8px; background: #409eff; cursor: nw-resize; border-radius: 2px; display: none;"></div></div><br>');
        // 将 Markdown 链接生成为可编辑/可弹窗的链接元素，和“链接”按钮一致
        html = html.replace(/\[([^\]]+)\]\(([^)]+)\)/g, '<span class="nsn-editable-link" data-href="$2">$1</span>');
        
        // 转义 HTML 特殊字符（但保留已处理的HTML标签）
        const htmlTags = [];
        html = html.replace(/<[^>]+>/g, (match) => {
            const index = htmlTags.length;
            htmlTags.push(match);
            return `__HTML_TAG_${index}__`;
        });
        
        html = html.replace(/&/g, '&amp;')
                  .replace(/</g, '&lt;')
                  .replace(/>/g, '&gt;');
        
        // 恢复HTML标签
        htmlTags.forEach((tag, index) => {
            html = html.replace(`__HTML_TAG_${index}__`, tag);
        });
        
        // 标题
        html = html.replace(/^### (.*$)/gm, '<h3 style="font-size: 1.1em; color: #374151; margin: 16px 0 8px 0;">$1</h3>');
        html = html.replace(/^## (.*$)/gm, '<h2 style="font-size: 1.3em; color: #374151; margin: 16px 0 8px 0; border-bottom: 1px solid #f3f4f6; padding-bottom: 4px;">$1</h2>');
        html = html.replace(/^# (.*$)/gm, '<h1 style="font-size: 1.5em; color: #374151; margin: 16px 0 8px 0; border-bottom: 2px solid #e5e7eb; padding-bottom: 6px;">$1</h1>');
        
        // 粗体
        html = html.replace(/\*\*(.*?)\*\*/g, '<strong style="font-weight: 600;">$1</strong>');
        
        // 斜体
        html = html.replace(/\*(.*?)\*/g, '<em style="font-style: italic;">$1</em>');
        
        // 引用
        html = html.replace(/^> (.*$)/gm, '<blockquote style="border-left: 4px solid #409eff; background: #f0f9ff; margin: 12px 0; padding: 8px 12px; font-style: italic;">$1</blockquote>');
        
        // 无序列表