feat: 标题、链接、图片、文本(加粗、倾斜)、代码块的解析和格式化

This commit is contained in:
fengxxc
2021-11-29 19:11:39 +08:00
parent ab6c8488d5
commit 79605c2817
5 changed files with 274 additions and 49 deletions

View File

@@ -53,14 +53,82 @@
<p data-mpa-powered-by="yiban.io"><span style="font-size: 16px;letter-spacing: 0.5px;background-color: transparent;caret-color: var(--weui-BRAND);">正文第一行</span><br></p>
<section style="line-height: 1.5em;"><span style="letter-spacing: 0.5px;font-size: 16px;"></span></section>
<section style="line-height: 1.5em;"><span style="letter-spacing: 0.5px;font-size: 16px;">正文第二行。<br></span></section>
<section style="line-height: 1.5em;text-align: center;"><img class="rich_pages wxw-img" data-galleryid="" data-ratio="1.0826306913996628" data-s="300,640" data-src="https://mmbiz.qpic.cn/mmbiz_png/GLeh42uInXRdNibLb2hf6QnMnWgic4Nm0KhCmicJibxESMoGfbuMrXbQB7lrYFSJPlBeGaJyciaavIBN8NLwESxia7cA/640?wx_fmt=png" data-type="png" data-w="593" style="box-shadow: rgb(210, 210, 210) 0em 0em 0.5em 0px; font-size: 17px; width: 346px !important; height: auto !important; visibility: visible !important;" _width="346px" src="https://mmbiz.qpic.cn/mmbiz_png/GLeh42uInXRdNibLb2hf6QnMnWgic4Nm0KhCmicJibxESMoGfbuMrXbQB7lrYFSJPlBeGaJyciaavIBN8NLwESxia7cA/640?wx_fmt=png&amp;tp=webp&amp;wxfrom=5&amp;wx_lazy=1&amp;wx_co=1" crossorigin="anonymous" alt="图片" data-fail="0"></section>
<section style="line-height: 1.5em;text-align: center;"><img class="rich_pages wxw-img" data-galleryid="" data-ratio="1.0826306913996628" data-s="300,640" data-src="<img class="rich_pages wxw-img" data-galleryid="" data-ratio="0.625" data-s="300,640" data-src="https://mmbiz.qpic.cn/mmbiz_jpg/Z6bicxIx5naLuefnXicbRG06t9JMcnk5ZfO77yyhu2Mtv9037eWJnq0H5ALU1jibAUEm21mUsx0cq11B6oGpGE1jQ/640?wx_fmt=jpeg" data-type="jpeg" data-w="1024" style="width: 677px !important; height: auto !important; visibility: visible !important;" _width="677px" src="https://mmbiz.qpic.cn/mmbiz_jpg/Z6bicxIx5naLuefnXicbRG06t9JMcnk5ZfO77yyhu2Mtv9037eWJnq0H5ALU1jibAUEm21mUsx0cq11B6oGpGE1jQ/640?wx_fmt=jpeg&amp;tp=webp&amp;wxfrom=5&amp;wx_lazy=1&amp;wx_co=1" crossorigin="anonymous" alt="图片" data-fail="0">" data-type="png" data-w="593" style="box-shadow: rgb(210, 210, 210) 0em 0em 0.5em 0px; font-size: 17px; width: 346px !important; height: auto !important; visibility: visible !important;" _width="346px" src="https://mmbiz.qpic.cn/mmbiz_png/GLeh42uInXRdNibLb2hf6QnMnWgic4Nm0KhCmicJibxESMoGfbuMrXbQB7lrYFSJPlBeGaJyciaavIBN8NLwESxia7cA/640?wx_fmt=png&amp;tp=webp&amp;wxfrom=5&amp;wx_lazy=1&amp;wx_co=1" crossorigin="anonymous" alt="图片" data-fail="0"></section>
<section style="line-height: 1.5em;">
<span style="letter-spacing: 0.5px;font-size: 16px;">正文第三行part1文本</span>
<a target="_blank" href="https://mp.weixin.qq.com/mp/appmsgalbum?__biz=Mzk0MjE3NDE0Ng==&amp;action=getalbum&amp;album_id=2123743679373688834#wechat_redirect" textvalue="你管这破玩意叫操作系统源码" linktype="text" imgurl="" imgdata="null" tab="innerlink" data-linktype="2" style="letter-spacing: 0.5px;font-size: 16px;" wah-hotarea="click">
<a target="_blank" href="https://mp.weixin.qq.com/mp/appmsgalbum?__biz=MzIzOTU0NTQ0MA==&action=getalbum&album_id=1391790902901014528#wechat_redirect" textvalue="你管这破玩意叫操作系统源码" linktype="text" imgurl="" imgdata="null" tab="innerlink" data-linktype="2" style="letter-spacing: 0.5px;font-size: 16px;" wah-hotarea="click">
<span style="letter-spacing: 0.5px;font-size: 16px;">正文第三行part2链接</span>
</a>
<span style="letter-spacing: 0.5px;font-size: 16px;">正文第三行part3文本。<br></span>
</section>
<h2 style="line-height: 1.75em;">
<strong><span style="font-size: 15px;color: rgb(255, 106, 0);">&nbsp;JDK层</span></strong>
</h2>
<h3 style="line-height: 1.75em;">
<span style="font-size: 15px;color: rgb(255, 106, 0);">1&nbsp;AbstractQueuedSynchronizer</span>
</h3>
<!-- 代行号的代码块 -->
<section class="code-snippet__fix code-snippet__js">
<ul class="code-snippet__line-index code-snippet__js">
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
<pre class="code-snippet__js" data-lang="cs">
<code><span class="code-snippet_outer">代码节选自java.util.concurrent.locks.ReentrantLock.java</span></code>
<code><span class="code-snippet_outer"> /** Synchronizer providing all implementation mechanics */</span></code>
<code><span class="code-snippet_outer"> private final Sync sync;</span></code>
<code><span class="code-snippet_outer"> /**</span></code>
<code><span class="code-snippet_outer"> * Base of synchronization control for this lock. Subclassed</span></code>
<code><span class="code-snippet_outer"> * into fair and nonfair versions below. Uses AQS state to</span></code>
<code><span class="code-snippet_outer"> * represent the number of holds on the lock.</span></code>
<code><span class="code-snippet_outer"> */</span></code>
<code><span class="code-snippet_outer"> abstract static class Sync extends AbstractQueuedSynchronizer {</span></code>
<code><span class="code-snippet_outer">......</span></code>
<code><span class="code-snippet_outer">}</span></code>
<code><span class="code-snippet_outer"><br></span></code>
<code><span class="code-snippet_outer"> public void lock() {</span></code>
<code><span class="code-snippet_outer"> sync.lock();</span></code>
<code><span class="code-snippet_outer"> }</span></code>
</pre>
</section>
<pre>
<section class="code-snippet__fix code-snippet__js">
<ul class="code-snippet__line-index code-snippet__js"><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li></ul>
<pre class="code-snippet__js" data-lang="java">
<code><span class="code-snippet_outer"> /**</span></code>
<code><span class="code-snippet_outer"> * Acquires in exclusive mode, ignoring interrupts. Implemented</span></code>
<code><span class="code-snippet_outer"> * by invoking at least once {@link #tryAcquire},</span></code>
<code><span class="code-snippet_outer"> * returning on success. Otherwise the thread is queued, possibly</span></code>
<code><span class="code-snippet_outer"> * repeatedly blocking and unblocking, invoking {@link</span></code>
<code><span class="code-snippet_outer"> * #tryAcquire} until success. This method can be used</span></code>
<code><span class="code-snippet_outer"> * to implement method {@link Lock#lock}.</span></code>
<code><span class="code-snippet_outer"> *</span></code>
<code><span class="code-snippet_outer"> * @param arg the acquire argument. This value is conveyed to</span></code>
<code><span class="code-snippet_outer"> * {@link #tryAcquire} but is otherwise uninterpreted and</span></code>
<code><span class="code-snippet_outer"> * can represent anything you like.</span></code>
<code><span class="code-snippet_outer"> */</span></code>
<code><span class="code-snippet_outer"> public final void acquire(int arg) {</span></code>
<code><span class="code-snippet_outer"> if (!tryAcquire(arg) &amp;&amp;</span></code>
<code><span class="code-snippet_outer"> acquireQueued(addWaiter(Node.EXCLUSIVE), arg))</span></code>
<code><span class="code-snippet_outer"> selfInterrupt();</span></code>
<code><span class="code-snippet_outer"> }</span></code>
</pre>
</section>
<section style="line-height: 1.75em;"><br></section>
</pre>
</div>
</div>
</div>