📅 最后修改于: 2023-12-03 15:37:20.775000 🧑 作者: Mango
Popper 是一个用于定位弹出框、提示框等浮动元素的库。与之相比，Bootstrap 的 tooltip 也是使用 Popper 实现的，因此在使用 Bootstrap 组件时也需要加载 Popper。
本文将介绍如何在 HTML 中加载 Popper。
下载 Popper 的源码或使用 CDN 加载。
在 HTML 文件中引入 Popper 的 JavaScript 文件。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>加载 Popper</title>
</head>
<body>
<!-- 引入 jQuery -->
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<!-- 引入 Popper -->
<script src="https://cdn.jsdelivr.net/npm/popper.js/dist/umd/popper.min.js"></script>
<script>
// 在此处编写使用 Popper 的 JavaScript 代码
</script>
</body>
</html>
在 JavaScript 代码中使用 Popper，例如：
new Popper(referenceElement, popperElement, {
placement: 'right'
});
以上代码将使 popperElement 相对于 referenceElement 在右侧定位。
加载 Popper 的步骤十分简单，只需引入其 JavaScript 文件即可。在 JavaScript 代码中使用 Popper 时，可使用 Popper 提供的 API 在浮动元素与参考元素之间创建定位关系。
参考资料：