Bei der Verwendung nativer JavaScript-Programmierung haben wir festgestellt, dass sie viele Mängel aufweist: Beispielsweise ist es unpraktisch, Elemente abzurufen, und manchmal ist es erforderlich, sie zu durchlaufen. Es kann zu Verschachtelungen beim Durchlaufen kommen, was den Code umständlicher und schlechter macht Toleranz. Heute werde ich Sie dazu bringen, jQuery zum Implementieren Ihrer ersten Webseite zu verwenden.
(1) HTML-Layoutseite verwenden
1) Erstellen Sie das Projekt Pro_01, erstellen Sie eine Webseite unter dem Projekt, nennen Sie sie index.html
2) Fügen Sie der HTML-Seite drei Schaltflächen hinzu
rrree; Fügen Sie der Seite drei DIV-Tags hinzu.
<input type="button" value="显示" id="show" /> <input type="button" value="隐藏" id="hide" /> <input type="button" value="内容填充" id="text"/>
(2) Verwenden Sie CSS, um die Seite zu verschönern.
1) Erstellen Sie einen CSS-Ordner unter dem Projekt Datei vor dem
<div></div> <div></div> <div></div>
3) Seitenstil unter der style.css-Datei hinzufügen
<head>
<link rel="stylesheet" href="css/style.css" type="text/css"/>
</head>*{
margin: 0;
padding: 0;
}(3) Einführung von jQuery-Dateien
1) Laden Sie die Datei jquery-3.5.1.js von der offiziellen Website herunter (https://jquery.com/download/);
2) Erstellen Sie nach Abschluss des Downloads Legen Sie die heruntergeladene jQuery-3.5.1js-Datei im Ordner js ab. Hinweis: Die in diesem Fall verwendete jQuery-Version ist 3.5.1. Platzieren Sie in diesem Fall die jQuery-Bibliotheksdatei im Ordner js . Um das Debuggen zu erleichtern, verwenden Sie relative Pfade.
3) Führen Sie die Datei vor dem -Tag in index.html ein.
div{
width:500px;
height:100px;
border:1px solid #a5b6c8;
background:#eef3f7;
display: none;
}(4) Effektimplementierung
1) Erstellen Sie das <script></script>-Tag vor dem -Tag
(2) Im
![[Web-Frontend] Node.js-Schnellstart](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
