|
1 | | -<!DOCTYPE html> |
| 1 | +<!doctype html> |
2 | 2 |
|
3 | 3 | <html> |
4 | 4 | <markdown-html |
5 | | - version="1.20.8" |
| 5 | + version="1.20.9" |
6 | 6 | author="PJ568" |
7 | 7 | repo="https://github.com/PJ-568/markdown.html" |
8 | 8 | license="CC BY-SA 4.0 International" |
9 | | - ></markdown-html> |
| 9 | + > |
| 10 | + </markdown-html> |
10 | 11 |
|
11 | 12 | <head> |
12 | 13 | <meta charset="utf-8" /> |
|
249 | 250 | bq.appendChild(switchButton); |
250 | 251 |
|
251 | 252 | const mainElement = document.querySelector( |
252 | | - ".markdown-body .content" |
| 253 | + ".markdown-body .content", |
253 | 254 | ); |
254 | 255 | mainElement.insertBefore(bq, mainElement.children[1]); |
255 | 256 | } |
|
353 | 354 | // 处理错误 |
354 | 355 | function updateContent(article, title = null, mdPath = pValue) { |
355 | 356 | try { |
356 | | - document.querySelector( |
357 | | - ".markdown-body" |
358 | | - ).innerHTML = `<div class="old-content Animated Animated-remove Animated--reverse Animate--fast Animate--noDelay Animate--slideInLeft">${ |
359 | | - document.querySelector(".markdown-body .content").innerHTML |
360 | | - }</div><div class="content Animated Animate--slideInRight">${article}</div>`; |
| 357 | + document.querySelector(".markdown-body").innerHTML = |
| 358 | + `<div class="old-content Animated Animated-remove Animated--reverse Animate--fast Animate--noDelay Animate--slideInLeft">${ |
| 359 | + document.querySelector(".markdown-body .content").innerHTML |
| 360 | + }</div><div class="content Animated Animate--slideInRight">${article}</div>`; |
361 | 361 | firstH1 = document.querySelector(".markdown-body .content h1"); |
362 | 362 | document.title = title |
363 | 363 | ? title |
364 | 364 | : firstH1 |
365 | | - ? firstH1.textContent |
366 | | - : mdPath; |
| 365 | + ? firstH1.textContent |
| 366 | + : mdPath; |
367 | 367 | } catch (error) { |
368 | 368 | throw error; |
369 | 369 | } |
|
374 | 374 | return new Promise((resolve, reject) => { |
375 | 375 | //// 检查是否已加载 |
376 | 376 | const existingLinks = document.querySelectorAll( |
377 | | - `link[href="${url}"]` |
| 377 | + `link[href="${url}"]`, |
378 | 378 | ); |
379 | 379 | if (existingLinks.length > 0) { |
380 | 380 | return resolve(url); |
|
398 | 398 | link.onerror = null; |
399 | 399 | link.onload = null; |
400 | 400 | document.head.removeChild(link); |
401 | | - reject(new Error(`无法加载CSS文件: ${url}`)); |
| 401 | + reject(new Error(`无法加载 CSS 文件:${url}`)); |
402 | 402 | }; |
403 | 403 |
|
404 | 404 | //// 添加到文档头部 |
|
422 | 422 | if (completedCount === totalElements) { |
423 | 423 | parentElement.removeEventListener( |
424 | 424 | "animationend", |
425 | | - handleAnimationEnd |
| 425 | + handleAnimationEnd, |
426 | 426 | ); |
427 | 427 | resolve(); |
428 | 428 | } |
|
437 | 437 | function handleError(mdPath, errorMessage) { |
438 | 438 | updateContent( |
439 | 439 | `<h1>加载失败</h1><p>加载文档<code>${mdPath}</code>时出错:<code>${errorMessage}</code>。您可以尝试<a class="refresh-btn" href="">重新加载</a>或<a class="back-btn">返回</a>。</p>`, |
440 | | - "加载失败" |
| 440 | + "加载失败", |
441 | 441 | ); |
442 | 442 | waitForAnimationsEnd( |
443 | 443 | document.querySelector(".markdown-body"), |
444 | 444 | ".content, .old-content", |
445 | | - ["Animation-slideInRight", "Animation-slideInLeft"] |
| 445 | + ["Animation-slideInRight", "Animation-slideInLeft"], |
446 | 446 | ).then(() => { |
447 | 447 | customPushState( |
448 | 448 | window.location.origin + |
449 | 449 | window.location.pathname + |
450 | | - (mdPath ? "?p=" + mdPath : "") |
| 450 | + (mdPath ? "?p=" + mdPath : ""), |
451 | 451 | ); |
452 | 452 | }); |
453 | 453 | endLoad(); |
|
517 | 517 | waitForAnimationsEnd( |
518 | 518 | document.querySelector(".markdown-body"), |
519 | 519 | ".content, .old-content", |
520 | | - ["Animation-slideInRight", "Animation-slideInLeft"] |
| 520 | + ["Animation-slideInRight", "Animation-slideInLeft"], |
521 | 521 | ).then(async () => { |
522 | 522 | await showMarkdownEnded(); |
523 | 523 | customPushState( |
524 | 524 | window.location.origin + |
525 | 525 | window.location.pathname + |
526 | | - (mdPath ? "?p=" + mdPath : "") |
| 526 | + (mdPath ? "?p=" + mdPath : ""), |
527 | 527 | ); |
528 | 528 | }); |
529 | 529 | } catch (error) { |
|
536 | 536 | //// 生成目录 |
537 | 537 | function generateOutline(doc) { |
538 | 538 | const headings = Array.from( |
539 | | - doc.querySelectorAll("h1, h2, h3, h4, h5, h6") |
| 539 | + doc.querySelectorAll("h1, h2, h3, h4, h5, h6"), |
540 | 540 | ); |
541 | 541 | if (headings.length === 0) return "<i>无目录</i>"; |
542 | 542 | var outline = "<ul>"; |
|
593 | 593 | "," + |
594 | 594 | response.status + |
595 | 595 | "," + |
596 | | - response.statusText |
| 596 | + response.statusText, |
597 | 597 | ); |
598 | 598 | } |
599 | 599 | } |
|
608 | 608 | const linkParser = new DOMParser(); |
609 | 609 | const linkDoc = linkParser.parseFromString( |
610 | 610 | `<div>${content}</div>`, |
611 | | - "text/html" |
| 611 | + "text/html", |
612 | 612 | ); |
613 | 613 |
|
614 | 614 | //// 处理所有 a 链接 |
|
659 | 659 |
|
660 | 660 | //// 添加目录 |
661 | 661 | content = `<details class="outline"><summary>${decodeURIComponent( |
662 | | - mdPath |
| 662 | + mdPath, |
663 | 663 | )}</summary></details><hr>${content}`; |
664 | 664 | const parser = new DOMParser(); |
665 | 665 | const doc = parser.parseFromString(content, "text/html"); |
|
678 | 678 | responseText, |
679 | 679 | request, |
680 | 680 | href, |
681 | | - options |
| 681 | + options, |
682 | 682 | ) { |
683 | 683 | if ( |
684 | 684 | /^<!doctype html>[\s\S]*?<html>[\s\S]*?<markdown-html/i.test( |
685 | | - request.responseText |
| 685 | + request.responseText, |
686 | 686 | ) |
687 | 687 | ) { |
688 | 688 | await showMarkdown(await decodeMDPath(href)); |
|
720 | 720 | history.pushState( |
721 | 721 | { url: url, title: document.title, uid: level }, |
722 | 722 | null, |
723 | | - url |
| 723 | + url, |
724 | 724 | ); |
725 | 725 | lastLevel = level++; |
726 | 726 | } else { |
|
748 | 748 | function initAboutBtn() { |
749 | 749 | const aboutBtn = document.querySelector(".about-btn"); |
750 | 750 | aboutBtn.href = `?p=${getDirectory( |
751 | | - window.location.pathname |
| 751 | + window.location.pathname, |
752 | 752 | )}about.md`; |
753 | 753 | } |
754 | 754 |
|
|
796 | 796 | } else if (event.animationName === "Animation-slideInLeft") { |
797 | 797 | document.querySelector(".markdown-body .old-content").remove(); |
798 | 798 | } |
799 | | - } |
| 799 | + }, |
800 | 800 | ); |
801 | 801 | //// 点击事件委托 |
802 | 802 | document.addEventListener("click", function (event) { |
|
894 | 894 | textarea, |
895 | 895 | code, |
896 | 896 | pre { |
897 | | - font-family: "Sarasa Term SC Nerd", "Maple Mono CN", Ubuntu, Roboto, |
898 | | - "Open Sans", "Microsoft YaHei", Arial, sans-serif; |
| 897 | + font-family: |
| 898 | + "Sarasa Term SC Nerd", "Maple Mono CN", Ubuntu, Roboto, "Open Sans", |
| 899 | + "Microsoft YaHei", Arial, sans-serif; |
899 | 900 | text-decoration: none; |
900 | 901 | } |
901 | 902 |
|
|
950 | 951 | nav a { |
951 | 952 | color: #fafafa; |
952 | 953 | padding: 0.3rem; |
953 | | - transition: color 0.2s, background-color 0.2s; |
| 954 | + transition: |
| 955 | + color 0.2s, |
| 956 | + background-color 0.2s; |
954 | 957 | } |
955 | 958 |
|
956 | 959 | nav a:hover { |
|
1041 | 1044 |
|
1042 | 1045 | /* Markdown 样式 */ |
1043 | 1046 | .markdown-body a { |
1044 | | - transition: color 0.2s, background-color 0.2s; |
| 1047 | + transition: |
| 1048 | + color 0.2s, |
| 1049 | + background-color 0.2s; |
1045 | 1050 | } |
1046 | 1051 |
|
1047 | 1052 | .markdown-body a:hover { |
|
1225 | 1230 | <!-- 导航栏 --> |
1226 | 1231 | <nav> |
1227 | 1232 | <a title="返回" class="back-btn"> |
1228 | | - <license content="Copyright (c) 2018-2025 Tabler" /> |
| 1233 | + <license content="Copyright (c) 2018-2025 Tabler"></license> |
1229 | 1234 | <svg |
1230 | 1235 | xmlns="http://www.w3.org/2000/svg" |
1231 | 1236 | width="24" |
|
1243 | 1248 | </svg> |
1244 | 1249 | </a> |
1245 | 1250 | <a title="刷新" class="refresh-btn" href=""> |
1246 | | - <license content="Copyright (c) 2018-2025 Tabler" /> |
| 1251 | + <license content="Copyright (c) 2018-2025 Tabler"></license> |
1247 | 1252 | <svg |
1248 | 1253 | xmlns="http://www.w3.org/2000/svg" |
1249 | 1254 | width="24" |
|
1262 | 1267 | </svg> |
1263 | 1268 | </a> |
1264 | 1269 | <a title="主页" class="to-home"> |
1265 | | - <license content="Copyright (c) 2018-2025 Tabler" /> |
| 1270 | + <license content="Copyright (c) 2018-2025 Tabler"></license> |
1266 | 1271 | <svg |
1267 | 1272 | xmlns="http://www.w3.org/2000/svg" |
1268 | 1273 | width="24" |
|
1282 | 1287 | </svg> |
1283 | 1288 | </a> |
1284 | 1289 | <a title="更改语言" id="translate"> |
1285 | | - <license content="Copyright (c) 2018-2025 Tabler" /> |
| 1290 | + <license content="Copyright (c) 2018-2025 Tabler"></license> |
1286 | 1291 | <svg |
1287 | 1292 | xmlns="http://www.w3.org/2000/svg" |
1288 | 1293 | width="24" |
|
1304 | 1309 | </svg> |
1305 | 1310 | </a> |
1306 | 1311 | <a title="切换显示模式" class="dark-btn" href="javascript:;"> |
1307 | | - <license content="Copyright (c) 2018-2025 Tabler" /> |
| 1312 | + <license content="Copyright (c) 2018-2025 Tabler"></license> |
1308 | 1313 | <svg |
1309 | 1314 | xmlns="http://www.w3.org/2000/svg" |
1310 | 1315 | width="24" |
|
1326 | 1331 | </svg> |
1327 | 1332 | </a> |
1328 | 1333 | <a title="关于" class="about-btn"> |
1329 | | - <license content="Copyright (c) 2018-2025 Tabler" /> |
| 1334 | + <license content="Copyright (c) 2018-2025 Tabler"></license> |
1330 | 1335 | <svg |
1331 | 1336 | xmlns="http://www.w3.org/2000/svg" |
1332 | 1337 | width="24" |
|
0 commit comments