分析以下html 使用这个js 在Java中实现markdown转思维导图生成html：
<html> <head> <
meta charset
=&
quot;UTF
-8&
quot; /> <
meta name
=&
quot;v
iewport&
quot;
content=&
quot;width
=device
-width, initial
-scale
=1.0&
quot; /> <
meta http-equiv=&
quot;X
-UA-Compatible&
quot;
content=&
quot;
ie=edge&
quot; /> <title>Markmap</title> <style> * { margin: 0; padding: 0; } html { font
-family: ui
-sans
-serif, system
-ui, sans
-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji'; } #mindmap { display: block; width:
100vw; height:
100vh; } .markmap
-dark { background: #27272a; color: white; } </style> <link rel
=&
quot;stylesheet&
quot; href
=&
quot;
https://cdn.jsdelivr.net/npm/markmap
-toolbar@0.
18.
12/dist/style.css&
quot;> <link rel
=&
quot;stylesheet&
quot; href
=&
quot;
https://cdn.jsdelivr.net/npm/katex@0.
16.
18/dist/katex.min.css&
quot;> </head> <body> <svg id
=&
quot;mindmap&
quot;></svg> <script src
=&
quot;
https://cdn.jsdelivr.net/npm/
[email protected]/dist/d3.min.js&
quot;></script> <script src
=&
quot;
https://cdn.jsdelivr.net/npm/markmap
-v
iew@0.
18.
12/dist/browser/index.js&
quot;></script> <script src
=&
quot;
https://cdn.jsdelivr.net/npm/markmap
-toolbar@0.
18.
12/dist/index.js&
quot;></script> <script>(e
=>{window.WebFontConfig
={custom:{famil
ies:[&
quot;KaTeX_AMS&
quot;,&
quot;KaTeX_Caligraphic:n4,n7&
quot;,&
quot;KaTeX_Fraktur:n4,n7&
quot;,&
quot;KaTeX_Main:n4,n7,i4,i7&
quot;,&
quot;KaTeX_Math:i4,i7&
quot;,&
quot;KaTeX_Script&
quot;,&
quot;KaTeX_SansSerif:n4,n7,i4&
quot;,&
quot;KaTeX_Size
1&
quot;,&
quot;KaTeX_Size2&
quot;,&
quot;KaTeX_Size3&
quot;,&
quot;KaTeX_Size4&
quot;,&
quot;KaTeX_Typewriter&
quot;]},active:()
=>{e().refreshHook.call()}}})(()
=>window.markmap)</script><script src
=&
quot;
https://cdn.jsdelivr.net/npm/webfontloader@
1.6.28/webfontloader.js&
quot; defer></script><script>(()
=>{setTimeout(()
=>{const{markmap:S,mm:Q}
=window,$
=new S.Toolbar;$.attach(Q);const I
=$.render();I.setAttribute(&
quot;style&
quot;,&
quot;position:absolute;bottom:20px;right:20px&
quot;),document.body.append(I)})})()</script> <script>((l,U,M,R)
=>{const N
=l();window.mm
=N.Markmap.create(&
quot;svg#mindmap&
quot;,(U||N.deriveOptions)(R),M),window.matchMedia(&
quot;(prefers
-color
-scheme: dark)&
quot;).matches
&
&document.documentElement.classList.add(&
quot;markmap
-dark&
quot;)})(()
=>window.markmap,null,{&
quot;
content&
quot;:&
quot;markmap&
quot;,&
quot;children&
quot;:[{&
quot;
content&
quot;:&
quot;Links&
quot;,&
quot;children&
quot;:[{&
quot;
content&
quot;:&
quot;<a href
=\&
quot;
https://markmap.js.org/\&
quot;>Website</a>&
quot;,&
quot;children&
quot;:[],&
quot;payload&
quot;:{&
quot;tag&
quot;:&
quot;li&
quot;,&
quot;lines&
quot;:&
quot;8,9&
quot;}},{&
quot;
content&
quot;:&
quot;<a href
=\&
quot;
https://github.com/gera2ld/markmap\&
quot;>GitHub</a>&
quot;,&
quot;children&
quot;:[],&
quot;payload&
quot;:{&
quot;tag&
quot;:&
quot;li&
quot;,&
quot;lines&
quot;:&
quot;9,
11&
quot;}}],&
quot;payload&
quot;:{&
quot;tag&
quot;:&
quot;h2&
quot;,&
quot;lines&
quot;:&
quot;6,7&
quot;}},{&
quot;
content&
quot;:&
quot;Related Projects&
quot;,&
quot;children&
quot;:[{&
quot;
content&
quot;:&
quot;<a href
=\&
quot;
https://github.com/gera2ld/coc
-markmap\&
quot;>coc
-markmap</a> for Neovim&
quot;,&
quot;children&
quot;:[],&
quot;payload&
quot;:{&
quot;tag&
quot;:&
quot;li&
quot;,&
quot;lines&
quot;:&
quot;
13,
14&
quot;}},{&
quot;
content&
quot;:&
quot;<a href
=\&
quot;
https://marketplace.vis
ualstudio.com/items?itemName
=gera2ld.markmap
-vscode\&
quot;>markmap
-vscode</a> for VSCode&
quot;,&
quot;children&
quot;:[],&
quot;payload&
quot;:{&
quot;tag&
quot;:&
quot;li&
quot;,&
quot;lines&
quot;:&
quot;
14,
15&
quot;}},{&
quot;
content&
quot;:&
quot;<a href
=\&
quot;
https://github.com/emacs
-eaf/eaf
-markmap\&
quot;>eaf
-markmap</a> for Emacs&
quot;,&
quot;children&
quot;:[],&
quot;payload&
quot;:{&
quot;tag&
quot;:&
quot;li&
quot;,&
quot;lines&
quot;:&
quot;
15,
17&
quot;}}],&
quot;payload&
quot;:{&
quot;tag&
quot;:&
quot;h2&
quot;,&
quot;lines&
quot;:&
quot;
11,
12&
quot;}},{&
quot;
content&
quot;:&
quot;Features&
quot;,&
quot;children&
quot;:[{&
quot;
content&
quot;:&
quot;Lists&
quot;,&
quot;children&
quot;:[{&
quot;
content&
quot;:&
quot;<strong>strong</strong> <s>del</s>
italic <mark>highlight</mark>&
quot;,&
quot;children&
quot;:[],&
quot;payload&
quot;:{&
quot;tag&
quot;:&
quot;li&
quot;,&
quot;lines&
quot;:&
quot;23,24&
quot;}},{&
quot;
content&
quot;:&
quot;<code>inline code</code>&
quot;,&
quot;children&
quot;:[],&
quot;payload&
quot;:{&
quot;tag&
quot;:&
quot;li&
quot;,&
quot;lines&
quot;:&
quot;24,25&
quot;}},{&
quot;
content&
quot;:&
quot;<svg width
=\&
quot;
16\&
quot; height
=\&
quot;
16\&
quot; v
iewBox
=\&
quot;0
-3 24 24\&
quot;><path d
=\&
quot;M
19 3H5a2 2 0 0 0
-2 2v
14a2 2 0 0 0 2 2h
14a2 2 0 0 0 2
-2V5a2 2 0 0 0
-2
-2m
-9
14
-5
-5
1.4
1-1.4
1L
10
14.
17l7.59
-7.59L
19 8z\&
quot;/></svg> checkbox&
quot;,&
quot;children&
quot;:[],&
quot;payload&
quot;:{&
quot;tag&
quot;:&
quot;li&
quot;,&
quot;lines&
quot;:&
quot;25,26&
quot;}},{&
quot;
content&
quot;:&
quot;Katex: <span class
=\&
quot;katex\&
quot;><span class
=\&
quot;katex
-mathml\&
quot;><math xmlns
=\&
quot;
http://www.w3.org/
1998/Math/MathML\&
quot;><semantics><mrow><mi>x</mi><mo>
=</mo><mfrac><mrow><mo>−</mo><mi>b</mi><mo>±</mo><msqrt><mrow><msup><mi>b</mi><mn>2</mn></msup><mo>−</mo><mn>4</mn><mi>a</mi><mi>c</mi></mrow></msqrt></mrow><mrow><mn>2</mn><mi>a</mi></mrow></mfrac></mrow><annotation encoding
=\&
quot;application/x
-tex\&
quot;>x
= {
-b \\pm \\sqrt{b^2
-4ac} \\over 2a}</annotation></semantics></math></span><span class
=\&
quot;katex
-html\&
quot; aria
-hidden
=\&
quot;true\&
quot;><span class
=\&
quot;base\&
quot;><span class
=\&
quot;strut\&
quot; style
=\&
quot;height:0.4306em;\&
quot;></span><span class
=\&
quot;mord mathnormal\&
quot;>x</span><span class
=\&
quot;mspace\&
quot; style
=\&
quot;margin
-right:0.2778em;\&
quot;></span><span class
=\&
quot;mrel\&
quot;>
=</span><span class
=\&
quot;mspace\&
quot; style
=\&
quot;margin
-right:0.2778em;\&
quot;></span></span><span class
=\&
quot;base\&
quot;><span class
=\&
quot;strut\&
quot; style
=\&
quot;height:
1.3845em;vertical
-align:
-0.345em;\&
quot;></span><span class
=\&
quot;mord\&
quot;><span class
=\&
quot;mord\&
quot;><span class
=\&
quot;mopen nulldelimiter\&
quot;></span><span class
=\&
quot;mfrac\&
quot;><span class
=\&
quot;vlist
-t vlist
-t2\&
quot;><span class
=\&
quot;vlist
-r\&
quot;><span class
=\&
quot;vlist\&
quot; style
=\&
quot;height:
1.0395em;\&
quot;><span style
=\&
quot;top:
-2.655em;\&
quot;><span class
=\&
quot;pstrut\&
quot; style
=\&
quot;height:3em;\&
quot;></span><span class
=\&
quot;sizing reset
-size6 size3 mtight\&
quot;><span class
=\&
quot;mord mtight\&
quot;><span class
=\&
quot;mord mtight\&
quot;>2</span><span class
=\&
quot;mord mathnormal mtight\&
quot;>a</span></span></span></span><span style
=\&
quot;top:
-3.23em;\&
quot;><span class
=\&
quot;pstrut\&
quot; style
=\&
quot;height:3em;\&
quot;></span><span class
=\&
quot;frac
-line\&
quot; style
=\&
quot;border
-bottom
-width:0.04em;\&
quot;></span></span><span style
=\&
quot;top:
-3.394em;\&
quot;><span class
=\&
quot;pstrut\&
quot; style
=\&
quot;height:3em;\&
quot;></span><span class
=\&
quot;sizing reset
-size6 size3 mtight\&
quot;><span class
=\&
quot;mord mtight\&
quot;><span class
=\&
quot;mord mtight\&
quot;>−</span><span class
=\&
quot;mord mathnormal mtight\&
quot;>b</span><span class
=\&
quot;mbin mtight\&
quot;>±</span><span class
=\&
quot;mord sqrt mtight\&
quot;><span class
=\&
quot;vlist
-t vlist
-t2\&
quot;><span class
=\&
quot;vlist
-r\&
quot;><span class
=\&
quot;vlist\&
quot; style
=\&
quot;height:0.922
1em;\&
quot;><span class
=\&
quot;svg
-align\&
quot; style
=\&
quot;top:
-3em;\&
quot;><span class
=\&
quot;pstrut\&
quot; style
=\&
quot;height:3em;\&
quot;></span><span class
=\&
quot;mord mtight\&
quot; style
=\&
quot;padding
-left:0.833em;\&
quot;><span class
=\&
quot;mord mtight\&
quot;><span class
=\&
quot;mord mathnormal mtight\&
quot;>b</span><span class
=\&
quot;msupsub\&
quot;><span class
=\&
quot;vlist
-t\&
quot;><span class
=\&
quot;vlist
-r\&
quot;><span class
=\&
quot;vlist\&
quot; style
=\&
quot;height:0.7463em;\&
quot;><span style
=\&
quot;top:
-2.786em;margin
-right:0.07
14em;\&
quot;><span class
=\&
quot;pstrut\&
quot; style
=\&
quot;height:2.5em;\&
quot;></span><span class
=\&
quot;sizing reset
-size3 size
1 mtight\&
quot;><span class
=\&
quot;mord mtight\&
quot;>2</span></span></span></span></span></span></span></span><span class
=\&
quot;mbin mtight\&
quot;>−</span><span class
=\&
quot;mord mtight\&
quot;>4</span><span class
=\&
quot;mord mathnormal mtight\&
quot;>a</span><span class
=\&
quot;mord mathnormal mtight\&
quot;>c</span></span></span><span style
=\&
quot;top:
-2.882
1em;\&
quot;><span class
=\&
quot;pstrut\&
quot; style
=\&
quot;height:3em;\&
quot;></span><span class
=\&
quot;hide
-tail mtight\&
quot; style
=\&
quot;min
-width:0.853em;height:
1.08em;\&
quot;><svg xmlns
=\&
quot;
http://www.w3.org/2000/svg\&
quot; width
=\&
quot;400em\&
quot; height
=\&
quot;
1.08em\&
quot; v
iewBox
=\&
quot;0 0 400000
1080\&
quot; preserveAspectRatio
=\&
quot;xMinYMin slice\&
quot;><path d
=\&
quot;M95,702\nc
-2.7,0,
-7.
17,
-2.7,
-13.5,
-8c
-5.8,
-5.3,
-9.5,
-10,
-9.5,
-14\nc0,
-2,0.3,
-3.3,
1,
-4c
1.3,
-2.7,23.83,
-20.7,67.5,
-54\nc44.2,
-33.3,65.8,
-50.3,66.5,
-5
1c
1.3,
-1.3,3,
-2,5,
-2c4.7,0,8.7,3.3,
12,
10\ns
173,378,
173,378c0.7,0,35.3,
-7
1,
104,
-2
13c68.7,
-142,
137.5,
-285,206.5,
-429\nc69,
-144,
104.5,
-2
17.7,
106.5,
-22
1\nl0
-0\nc5.3,
-9.3,
12,
-14,20,
-14\nH400000v40H845.2724\ns
-225.272,467,
-225.272,467s
-235,486,
-235,486c
-2.7,4.7,
-9,7,
-19,7\nc
-6,0,
-10,
-1,
-12,
-3s
-194,
-422,
-194,
-422s
-65,47,
-65,47z\nM834 80h400000v40h
-400000z\&
quot;/></svg></span></span></span><span class
=\&
quot;vlist
-s\&
quot;></span></span><span class
=\&
quot;vlist
-r\&
quot;><span class
=\&
quot;vlist\&
quot; style
=\&
quot;height:0.
1179em;\&
quot;><span></span></span></span></span></span></span></span></span></span><span class
=\&
quot;vlist
-s\&
quot;></span></span><span class
=\&
quot;vlist
-r\&
quot;><span class
=\&
quot;vlist\&
quot; style
=\&
quot;height:0.345em;\&
quot;><span></span></span></span></span></span><span class
=\&
quot;mclose nulldelimiter\&
quot;></span></span></span></span></span></span>&
quot;,&
quot;children&
quot;:[{&
quot;
content&
quot;:&
quot;<a href
=\&
quot;#?d
=gist:af76a4c245b302206b
16aec503dbe07b:katex.md\&
quot;>More Katex Examples</a>&
quot;,&
quot;children&
quot;:[],&
quot;payload&
quot;:{&
quot;tag&
quot;:&
quot;li&
quot;,&
quot;lines&
quot;:&
quot;27,28&
quot;}}],&
quot;payload&
quot;:{&
quot;tag&
quot;:&
quot;li&
quot;,&
quot;lines&
quot;:&
quot;26,28&
quot;,&
quot;fold&
quot;:
1}},{&
quot;
content&
quot;:&
quot;Now we can wrap very very very very long text with the <code>maxWidth</code> option&
quot;,&
quot;children&
quot;:[],&
quot;payload&
quot;:{&
quot;tag&
quot;:&
quot;li&
quot;,&
quot;lines&
quot;:&
quot;28,29&
quot;}},{&
quot;
content&
quot;:&
quot;Ordered list&
quot;,&
quot;children&
quot;:[{&
quot;
content&
quot;:&
quot;
1. item
1&
quot;,&
quot;children&
quot;:[],&
quot;payload&
quot;:{&
quot;tag&
quot;:&
quot;li&
quot;,&
quot;lines&
quot;:&
quot;30,3
1&
quot;,&
quot;listIndex&
quot;:
1}},{&
quot;
content&
quot;:&
quot;2. item 2&
quot;,&
quot;children&
quot;:[],&
quot;payload&
quot;:{&
quot;tag&
quot;:&
quot;li&
quot;,&
quot;lines&
quot;:&
quot;3
1,33&
quot;,&
quot;listIndex&
quot;:2}}],&
quot;payload&
quot;:{&
quot;tag&
quot;:&
quot;li&
quot;,&
quot;lines&
quot;:&
quot;29,33&
quot;}}],&
quot;payload&
quot;:{&
quot;tag&
quot;:&
quot;h3&
quot;,&
quot;lines&
quot;:&
quot;2
1,22&
quot;}},{&
quot;
content&
quot;:&
quot;Blocks&
quot;,&
quot;children&
quot;:[{&
quot;
content&
quot;:&
quot;<pre data
-lines
=\&
quot;35,38\&
quot;><code class
=\&
quot;lang
uage
-js\&
quot;><span class
=\&
quot;hljs
-variable lang
uage_\&
quot;>console</span>.<span class
=\&
quot;hljs
-title function_\&
quot;>log</span>(<span class
=\&
quot;hljs
-string\&
quot;>
&apos;hello, JavaScript
&apos;</span>)\n</code></pre>&
quot;,&
quot;children&
quot;:[],&
quot;payload&
quot;:{&
quot;tag&
quot;:&
quot;pre&
quot;,&
quot;lines&
quot;:&
quot;35,38&
quot;}},{&
quot;
content&
quot;:&
quot;<table data
-lines
=\&
quot;39,43\&
quot;>\n<thead data
-lines
=\&
quot;39,40\&
quot;>\n<tr data
-lines
=\&
quot;39,40\&
quot;>\n<th>Products</th>\n<th>Price</th>\n</tr>\n</thead>\n<tbody data
-lines
=\&
quot;4
1,43\&
quot;>\n<tr data
-lines
=\&
quot;4
1,42\&
quot;>\n<td>Apple</td>\n<td>4</td>\n</tr>\n<tr data
-lines
=\&
quot;42,43\&
quot;>\n<td>Banana</td>\n<td>2</td>\n</tr>\n</tbody>\n</table>&
quot;,&
quot;children&
quot;:[],&
quot;payload&
quot;:{&
quot;tag&
quot;:&
quot;table&
quot;,&
quot;lines&
quot;:&
quot;39,43&
quot;}},{&
quot;
content&
quot;:&
quot;<img src
=\&
quot;
https://markmap.js.org/favicon.png\&
quot; alt>&
quot;,&
quot;children&
quot;:[],&
quot;payload&
quot;:{&
quot;tag&
quot;:&
quot;img&
quot;,&
quot;lines&
quot;:&
quot;44,45&
quot;}}],&
quot;payload&
quot;:{&
quot;tag&
quot;:&
quot;h3&
quot;,&
quot;lines&
quot;:&
quot;33,34&
quot;}}],&
quot;payload&
quot;:{&
quot;tag&
quot;:&
quot;h2&
quot;,&
quot;lines&
quot;:&
quot;
17,
18&
quot;}}]},{&
quot;colorFreezeLevel&
quot;:2})</script> </body> </html>
本文提供了一个链接参考，具体内容需要通过提供的链接访问查看。
扫一扫
2030
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
