我对实现有另一个问题，这次我尝试创建一个模式div，它不起作用。创建了按钮，但是当我单击它时，什么也没有发生。我还链接了所有实现文件，并且它还是行不通这是我的html代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<!--Import materialize.css-->
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<!--Import materialize.css-->
<link type="text/css" rel="stylesheet" href="../css/materialize.min.css" media="screen,projection" />
<!--Let browser know website is optimized for mobile-->
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.13.0/css/all.css"
integrity="sha384-Bfad6CLCknfcloXFOyFnlgtENryhrpZCe29RTifKEixXQZ38WheV+i/6YWSzkz3V" crossorigin="anonymous">
<link href="https://fonts.googleapis.com/css?family=Nunito+Sans:400,600,700,800&display=swap" rel="stylesheet">
<link rel="stylesheet" href="../css/home.css">
<title>Document</title>
</head>
<body>
<!-- Modal Trigger -->
<a class="waves-effect waves-light btn modal-trigger" href="#modal1">Modal</a>
<!-- Modal Structure -->
<div id="modal1" class="modal">
<div class="modal-content">
<h4>Modal Header</h4>
<p>A bunch of text</p>
</div>
<div class="modal-footer">
<a href="#!" class="modal-close waves-effect waves-green btn-flat">Agree</a>
</div>
</div>
</body>
<!-- FIREBASE -->
<script src="https://www.gstatic.com/firebasejs/7.13.2/firebase-app.js"></script>
<script src="https://www.gstatic.com/firebasejs/7.13.2/firebase-firestore.js"></script>
<script src="https://www.gstatic.com/firebasejs/7.13.2/firebase-auth.js"></script>
<!-- JAVASCRIPT -->
<script src="../scripts/app.js"></script>
<script src="../scripts/account.js"></script>
<script src="https://kit.fontawesome.com/a076d05399.js"></script>
<!--JavaScript at end of body for optimized loading-->
<script type="text/javascript" src="../scripts/materialize.min.js"></script>
</html> -->
您需要initialize模态：
document.addEventListener('DOMContentLoaded', function() {
var elems = document.querySelectorAll('.modal');
var instances = M.Modal.init(elems);
});