You need to enable JavaScript to run this app.
最新活动
大模型
产品
解决方案
定价
生态与合作
支持与服务
开发者
了解我们

如何使用JSON生成输出?附结构化JSON文件示例

Alright, let's figure out how to convert that JSON structure into clean Markdown output. The key here is mapping each object's style property to the right Markdown syntax, then plugging in the content appropriately.

First, define the mapping rules

Each style in your JSON corresponds directly to a Markdown element:

  • h1# [content] (level 1 heading)
  • h2## [content] (level 2 heading)
  • h3### [content] (level 3 heading)
  • p → Plain text paragraph (Markdown doesn't need special syntax for paragraphs, just ensure there's an empty line between blocks)
  • img![alt-text](image-path) (we can use the image filename as the alt text for simplicity)

Example implementation (JavaScript)

Here's a straightforward function that takes your JSON array and outputs formatted Markdown:

// Your input JSON structure
const contentJson = [
  { "style":"h1", "content":"this is h1" },
  { "style":"p", "content":"this is a long paragraph " },
  { "style":"img", "content":"image1.jpg" },
  { "style":"h2", "content":"this is h2" },
  { "style":"h3", "content":"this is h3" },
  { "style":"h1", "content":"this is h1 number 2" },
  { "style":"p", "content":"this is a long paragraph 2 " },
  { "style":"img", "content":"image2.jpg" },
  { "style":"h2", "content":"this is h2 number 2" },
  { "style":"h3", "content":"this is h3 number 2" }
];

function jsonToMarkdown(json) {
  let markdown = '';
  
  json.forEach(item => {
    switch(item.style) {
      case 'h1':
        markdown += `# ${item.content}\n\n`;
        break;
      case 'h2':
        markdown += `## ${item.content}\n\n`;
        break;
      case 'h3':
        markdown += `### ${item.content}\n\n`;
        break;
      case 'p':
        markdown += `${item.content}\n\n`;
        break;
      case 'img':
        // Use the image filename (without extension) as alt text
        const altText = item.content.split('.')[0];
        markdown += `![${altText}](${item.content})\n\n`;
        break;
      // Add more cases here if you need to support other styles (like blockquotes, lists)
      default:
        // Fallback: treat unknown styles as plain paragraphs
        markdown += `${item.content}\n\n`;
    }
  });
  
  // Trim extra newlines at the end
  return markdown.trim();
}

// Generate and log the Markdown result
const markdownOutput = jsonToMarkdown(contentJson);
console.log(markdownOutput);

Generated Markdown output

Running the above code will produce this valid Markdown:

# this is h1

this is a long paragraph 

![image1](image1.jpg)

## this is h2

### this is h3

# this is h1 number 2

this is a long paragraph 2 

![image2](image2.jpg)

## this is h2 number 2

### this is h3 number 2

Notes & extensions

  • We add two newlines after each element because Markdown requires empty lines to separate block-level elements (otherwise headings might merge with paragraphs, etc.).
  • If you need to support more styles (like blockquote, ul/li), just add new cases to the switch statement. For example, a blockquote style would map to > ${item.content}.
  • For Python users, here's a quick equivalent function:
content_json = [
    {"style":"h1", "content":"this is h1"},
    {"style":"p", "content":"this is a long paragraph "},
    {"style":"img", "content":"image1.jpg"},
    # Include the rest of your JSON items here
]

def json_to_markdown(json_data):
    markdown = ""
    for item in json_data:
        style, content = item["style"], item["content"]
        if style == "h1":
            markdown += f"# {content}\n\n"
        elif style == "h2":
            markdown += f"## {content}\n\n"
        elif style == "h3":
            markdown += f"### {content}\n\n"
        elif style == "p":
            markdown += f"{content}\n\n"
        elif style == "img":
            alt_text = content.split('.')[0]
            markdown += f"![{alt_text}]({content})\n\n"
        else:
            markdown += f"{content}\n\n"
    return markdown.strip()

print(json_to_markdown(content_json))

内容的提问来源于stack exchange,提问作者i.lf

火山引擎 最新活动