如何解决CDN错误的问题

问题描述 投票:0回答:1

每当我尝试使用 CDN(内容交付网络)时,它都不起作用。大多数时候,在控制台中,它的行为就像我粘贴了一个普通链接,或者即使我使用 4G 互联网连接,我什至没有粘贴任何链接。

这是下面的代码,我将 CDN 链接粘贴到我的 html 标头中,我也尝试将其粘贴到我的 JS 脚本中,但没有解决方案。请帮助,我将感谢您的反馈。

注意:CDN 库在我使用时通常不起作用,但这是一个 Markdown CDN 库。

<!DOCTYPE html>
<html lang="en">
    <head>
        <title>Markdown CDN</title>
        
        <!--BEGINNING OF THE CDN LINK IN MY HTML-->
         
        <script src="https://cdnjs.cloudflare.com/ajax/libs/marked/7.0.2/marked.min.js" integrity="sha512-      Y+SkIEaxkj9RglaZ4p/VvDnuaj5+qK4noarB/ZqRChnFl712vOlJTmD3wK6HEXq00R0bFsFvJ5vEEkYezwugZw==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>

        <!--END OF THE CDN LINK IN MY HTML-->

        <link rel="stylesheet" href="markdown.css">
        <script src="https://kit.fontawesome.com/4a70be6355.js" crossorigin="anonymous"></script>
        
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
    </head>
    <body>

        <div class="all">
            <div class="tools">
                <button class="edit"><i class="fa-regular fa-pen-to-square"></i></button>
                <button class="delete"><i class="fas fa-trash"></i></button>
            </div>
            <main class="main hidden"></main>
            <textarea name="" id="" cols="30" rows="10"></textarea>
        </div>

         
         <script>

            const all = document.querySelector('.all');
            const textarea = all.querySelector('textarea');
            const main = all.querySelector('.main');
            const editBtn = document.querySelector('.edit');
            const deleteBtn = document.querySelector('.delete');

            editBtn.addEventListener('click', ()=> {
                main.classList.toggle('hidden');
                textarea.classList.toggle('hidden');
            })

            textarea.addEventListener('input', (e)=> {
                const {value} = e.target;

                main.innerHTML = marked(value);
            })

         </script>
    </body>
</html>

我尝试将下面的链接粘贴到我的JS中仍然没有解决方案;

/*BEGINNING OF THE CDN LINK IN MY JS*/

<script src="https://cdnjs.cloudflare.com/ajax/libs/marked/7.0.2/marked.min.js" integrity="sha512-Y+SkIEaxkj9RglaZ4p/VvDnuaj5+qK4noarB/ZqRChnFl712vOlJTmD3wK6HEXq00R0bFsFvJ5vEEkYezwugZw==" crossorigin="anonymous" referrerpolicy="no-referrer"></script> 

/*END OF THE CDN LINK IN MY JS*/
         <script>

            const all = document.querySelector('.all');
            const textarea = all.querySelector('textarea');
            const main = all.querySelector('.main');
            const editBtn = document.querySelector('.edit');
            const deleteBtn = document.querySelector('.delete');

            editBtn.addEventListener('click', ()=> {
                main.classList.toggle('hidden');
                textarea.classList.toggle('hidden');
            })

            textarea.addEventListener('input', (e)=> {
                const {value} = e.target;

                main.innerHTML = marked(value);
            })
javascript html css cdn
1个回答
0
投票

您想要

marked.parse()
,而不是
marked()

let input = document.getElementById('markdown').innerHTML;

let output = marked.parse(input)

document.getElementById('transformed').innerHTML = output;
<script src="https://cdnjs.cloudflare.com/ajax/libs/marked/7.0.2/marked.min.js" integrity="sha512-Y+SkIEaxkj9RglaZ4p/VvDnuaj5+qK4noarB/ZqRChnFl712vOlJTmD3wK6HEXq00R0bFsFvJ5vEEkYezwugZw==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>

<div id="markdown">
# This is markdown
1. It 
2. has
3. lists
4. and *formatting* of **text** in __different__ _styles_
</div>

<div id="transformed"></div>

下次,当某些事情没有按照您期望的方式工作时,通常值得仔细阅读错误消息(并将其包含在您的问题中,而不是仅仅说“它不起作用”!)尝试使用也会有帮助。 (在这种情况下,我的第一个调试步骤是

console.log(marked)
,它表明它不是一个函数)。

如果您经常在使用外部代码库时遇到问题,请检查他们的文档以确保您遵循他们的 API。

© www.soinside.com 2019 - 2024. All rights reserved.