如果您的问题是入门，请使用众多可用的小提琴工具之一。
jqfiddle有一个 html、css 和一个 jquery 部分，您可以填写。它应该支持您需要的所有基本示例，以及一些高级示例。但既然我们说的是“入门级”，那么这应该足以说明你能做什么。然后了解如何在本地或稍后在服务器上设置所有这些。
您也可以只设置一个带有用户文件夹的服务器，他们也可以通过 ftp 在本地上传，然后托管这些用户文件夹（但是，这需要您进行更多设置）。
或者使用github pages之类的东西来托管内容。让想要学习编码的学生参与到 github 之类的平台中，也非常适合探索和学习。
更新：
在 OPs 回答了他自己的问题之后，我想知道这个答案的实际问题是什么：
integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous">
以上内容已添加到加载文件的标签中。
这是加载外部资源时使用的安全功能，称为：子资源完整性
完整性属性的内容需要与正在加载的文件生成的哈希相匹配，并且实际上仅在您的代码和资源位于不同位置（跨源）时使用，它可以保护您的站点免受第三次更改的文件的影响-派对现场。
哈希确保您期望的代码是从第三方加载的代码，如果它已更改（被黑客入侵），则代码将不会在您的页面上执行。
因此，在您的本地情况下，每次代码更改时，您都必须从文件内容生成一个新的哈希，并将其放入完整性属性中，如果资源位于同一位置，这实际上没有意义，因为攻击者可以只修改您的站点而不是实际的脚本文件。
进一步更新：
如果您想从文件中测试某些内容，应该可以使用如下所示的简单 html 文件，它还可以毫无问题地从带有 SRI 的 cdn 加载脚本。
<html>
<head>
<script src="https://code.jquery.com/jquery-3.3.1.slim.js"
integrity="sha256-fNXJFIlca05BIO2Y5zh1xrShK3ME+/lYZ0j+ChxX2DA="
crossorigin="anonymous"></script>
</head>
<body>
<h1>Hello World!</h1>
<script type="text/javascript">
$("body").append("<span>I was added from jquery script!</span>");
</script>
该脚本直接从jquery 的 cdn提供的片段中复制/粘贴