1 Einleitung
Mit der kontinuierlichen Popularisierung und Entwicklung des Internets/Intranets beginnen immer mehr Unternehmen, Unternehmen und Einzelpersonen, ihre eigenen Websites zu erstellen, Webseiten zu schreiben und Informationen auf eine neue Art und Weise nach außen zu veröffentlichen, damit die Menschen sie durchsuchen können . , Lektüre und Anwendung. Daher hat die Erstellung von Webseiten die Aufmerksamkeit von immer mehr Fachleuten auf sich gezogen.
Unter Webseiten versteht man einige Dokumentdateien, die der Welt über das Internet Informationen bereitstellen, darunter persönliche Informationen, geschäftliche Informationen, Unterhaltungsinhalte und andere Inhalte. Webseiten werden mit HyperText Markup Language (HTML) geschrieben und auf Webservern im Internet/Intranet gespeichert, damit Besucher sie mit einem Browser lesen können. In HTML-Sprache geschriebene Webseiten werden auch als Hypertext bezeichnet, d. h. Webseiten enthalten Multimedia-Informationen wie Text, Grafiken, Töne, Bilder und Hyperlinks (HyperLink).
2 DHTML Einfach
Ich kann im Browser auf eine große Anzahl von Webseiten zugreifen, die in HTML und Skriptsprachen geschrieben sind. Um das Surfen zu erleichtern, haben verschiedene Computerhersteller eigene Browser auf den Markt gebracht. Diese Browser verfügen noch nicht über einen einheitlichen Standard zur Unterstützung von HTML, was der Entwicklung des Internets offensichtlich nicht förderlich ist. Daher hat das World Wide Web Consortium (W3C) eine plattform- und sprachunabhängige Spezifikation entwickelt, das Document Object Model (DOM).
DOM kombiniert HTML, CSS (Cascading Style Sheets) und Skriptsprachen zu einem Interoperabilitätsmodell, das von einer oder mehreren Personen implementiert werden kann. Sowohl Netscape als auch Microsoft haben dem W3C Vorschläge zur Implementierung von DOM gemacht: Verwenden Sie dynamisches HTML, also DHTML (Dynamic HTML), um das Problem zu lösen.
DHTML ist ein allgemeiner Begriff für mehrere neue Funktionen, die erweitert wurden und gleichzeitig die Kompatibilität mit vorhandenem HTML beibehalten. Diese neuen Funktionen beziehen sich hauptsächlich auf dynamische Funktionen, Positionierungsfunktionen und die Möglichkeit, CSS zu verwenden.
Es gibt zwei Gründe für die Verwendung von DHTML: Erstens unterteilt DHTML jedes Element auf der Webseite in viele unabhängige Objekte, und die Eigenschaften dieser Objekte werden über CSS angegeben. Zweitens öffnet DHTML jedes Objekt für ein Programmier- und Skriptsprachen-Framework. Die Programmiersprache C++ kann zum Bearbeiten von Objekten auf der Webseite verwendet werden, und Java-Skript und VBscript können auch zum Bearbeiten von Objekten auf der Webseite verwendet werden. Das bedeutet, dass die Webseite und alles darauf programmierbar ist, was der Webseite neue Möglichkeiten verleiht. Wir werden den Unterschied feststellen, wenn wir die Anwendung ausführen: Wenn wir das Programm früher im Web ausgeführt haben, mussten wir jedes Mal warten, bis die Webseite erneut heruntergeladen wurde, wenn eine Webseite eine große Anzahl enthielt Bei versteckten Objekten würde es sogar einen Vollbildmodus erfordern, um mit DHTML erneut auf den Server zuzugreifen. Sie können auf ein Bild oben auf dem Bildschirm klicken, um die Absätze am unteren Rand zu erstellen Bildschirmwechsel sofort möglich, ohne erneut auf den Server zugreifen zu müssen. Alle Tabellen werden zu Live-Datenbanken und Benutzer können die Daten dynamisch filtern und sortieren. Dadurch wird die Anzahl der Anfragen an den Server reduziert, wodurch die Belastung des Servers verringert und die Gesamtleistung von Client und Server verbessert wird.
3 Verwendung von Stylesheets CSS
Die Basis von DHTML sind Cascading Style Sheets (Cascading Style Sheets). Der Stil bezieht sich auf eine Reihe von Anzeige- und Positionierungsattributen, die vom Autor der Webseite definiert werden. Das größte Merkmal von CSS ist das objektorientierte Webdesign, d. h. jede Seite, jeder Absatz, jedes Bild und jede Tabelle wird als Objekt betrachtet. Dann deklarieren Sie jede Instanz dieses Objekts. Jede Instanz verfügt über einen Stil, bei dem es sich um eine Reihe von Attributen oder Anzeigeanweisungen handelt. Solange sie einmal deklariert werden, werden diese Eigenschaften auf der gesamten Webseite oder sogar der gesamten Site verwendet. Jedem Stil kann ein Name zugewiesen werden, z. B. H1, Li. Wenn der Name des Stils mit dem Namen eines gültigen DHTML-Elements (oder -Tags) übereinstimmt, wird der Stil automatisch auf jede Instanz des Elements angewendet Wenn ein Stil ohne entsprechendes DHTML-Tag benannt wird, muss der Stil manuell an der Stelle angewendet werden, an der er angezeigt werden soll.
3.1 Definieren und verwenden Sie grundlegende Stile im folgenden Programmsegment: H1 und Favorit. H1 ist ein gültiges DHTML-Element. Der mit 〈H1〈／H1〉 gekennzeichnete Teil erbt alle Attribute des Stils H1 ;Favour ist ein Nicht-DHTML-Element. Wenn Sie darauf verweisen, müssen Sie den mit
〈HTML〉
〈HEAD〉〈TITLE〉test〈／TITLE〉
〈STYLE TYPE=”text／css〉
〈 !--
H1{font-style:normal;
Schriftstärke:fett;
Farbe: grün;
line-height:20pt} ／Stil H1 definieren／
.favor{font-style:normal;
Schriftgröße:15pt;
Hintergrundbild:url(back.imag.gif);
textalign:center} ／Stilfavoriten definieren／
--〉
〈H1〉DAS IST EIN TEST!〈／H1〉／Verwendungsstil H1／
〈P CLASS=”favor”〉GEFÄLLT IHNEN DAS?〈／P〉／Verwenden Sie den Stil favor／
3.2 Verwendung externer Stile Stylesheets können auch in externen Dateien gespeichert werden. Die Verbindung zwischen dieser Datei und der Seite kann über IMPORT oder LINK erfolgen Das Stylesheet wird beispielsweise in der Datei mysite.css gespeichert. Sie können den folgenden Code in das Dokument einfügen, um das externe Stylesheet aufzurufen:
〈LINK REL=STYLESHEET
HREF=“mysite.css“
TYPE=“text／css“
Title=“Test Style“〉
4 Interaktive Funktion realisieren
CSS selbst hat keine interaktive Funktion. Um eine Interaktion zu realisieren, ist es notwendig, das durch CSS definierte Objekt mit dem Dokumentmodell (DOM) zu kombinieren und das Webdokument in ein DHTML-Dokument zu konvertieren. DOM bietet Skriptsprachen die Möglichkeit, auf Elemente auf der Seite zuzugreifen. Die von Microsoft und Netscape unterstützten Objektmodelle unterscheiden sich etwas.
Im Microsoft-Modell haben Skriptsprachen Zugriff auf alle Elemente einer HTML-Seite, und alle Elemente werden als Objekte in document.all wiedergegeben. Der folgende Programmausschnitt wird verwendet, um alle Elemente der Seite auszuschreiben:
for (I=0;I
document.write(document.all［I］.tagName+“＼n“ );
}
Im Netscape-Modell kann eine Skriptsprache auf einen bestimmten Satz von Elementen auf einer HTML-Seite zugreifen, beispielsweise auf den Inhalt im
for (I=0;I
document.write(document.layers［I］.name+“＼n“);
}
5 Der Einsatz von Positionierungstechnologie
In HTML ist die Position eines Objekts immer relativ zu anderen Teilen der Webseitenstruktur. Wenn wir Webseiten kompilieren, quetschen wir oft ein Bild aus der Seite, indem wir einen Text hinzufügen. Mithilfe der Positionierungstechnologie von DHTML können Objekte nun fixiert und gestapelt werden, d.
Beispiel:
*myback{background-color:transparent}
*mypoit
Position:absolut;
oben: 5 Zoll;
rechts: 5 Zoll;
Breite: 10 Zoll}
KÖRPER{background-image:url(／image／back.gif);}
〈class=.mypoint〉Img(src=“／image／a.gif)
〈DIV CLASS=“pile“ ID=“image1“ style=“z-index:4“〉
〈DIV CLASS=“pile“ ID=“image2“ style=“z-index:3“〉
〈DIV CLASS=“pine“ ID=“image3“ style=“z-index:2“〉
〈DIV CLASS=“pine“ ID=“image4“ style=“z-index:1“〉
Im obigen Programmabschnitt ist der Hintergrund so eingestellt, dass Licht durch die Grundkarte dringen kann. Dieser Effekt konnte bisher nur durch den Einsatz spezieller Zeichenwerkzeuge erreicht werden. Auf der Seite sind auch 4 Bilder gestapelt, und die Animationseffekte, die sie erzeugen, sind ebenfalls sehr gut.
6 Fazit
Das Obige hat einige Untersuchungen zur Verwendung von DHTML zum Kompilieren von Webseiten durchgeführt. Es gibt noch viele technische Probleme, die darauf warten, dass Webseitenersteller gemeinsam vertieft werden.
Wei Xiaotan ist Masterstudent an der School of Transportation der Northern Jiaotong University, 100044, Peking.