Als ich heute Code eingegeben habe, wollte ich eine Funktion zum Wechseln von Avataren schreiben, aber hier kommt das Problem: Der Avatar wird einfach nicht angezeigt. Plötzlich hatte ich eine Idee, dass die Art und Weise, Bildpfade in CSS und JavaScript zu schreiben, unterschiedlich ist. ? ?
Hmm... Es ist so:
Eine neue „Bilder“-Datei im Stammverzeichnis erstellt und zwei Bilder bg1.png und bg2.png darin abgelegt
Zwei zusätzliche Ordner „style“ und „script“ werden im Stammverzeichnis erstellt, um die verwendeten .css-Dateien und .js-Dateien zu speichern.
index.html enthält
<div id="pic"> <p>开心吗</p> </div>
Wenn ich möchte Um den Bildhintergrund des Tags mit der ID von pic festzulegen, würde ich Folgendes in die CSS-Datei schreiben:
#pic{ background:url(../images/bg1.png); }
, und in die JS-Datei würde ich den Pfad als images/bg1.png schreiben
Kurz gesagt:
(1) Bei JS-Skripten besteht HTML darin, das Skript in die Seite zu laden und zusammen zu analysieren (genau wie Ihr JS-Skript direkt auf dieser Seite geschrieben ist)
(2) Für CSS-Dateien wird nur ein Link bereitgestellt und nicht in die HTML-Seite geladen. In diesem Beispiel sucht HTML beispielsweise anhand des Links nach der erforderlichen Bilddatei in der CSS-Datei.
Der Bilddateipfad von CSS ist relativ zu sich selbst, und der Bilddateipfad von JS ist relativ zu der Datei, in der er sich befindet.