HTML-Code-Behind

Für die meisten Benutzer gehen Webseiten-Pseudoklassen nicht tief in die Materie ein und sie wissen nur, wie sie ein grundlegendes Framework überprüfen, nämlich die HTML-Struktur, CSS-Dateien und JavaScript-Code. Auf einigen einfachen Webseiten können wir CSS-Stile direkt in HTML-Dateien schreiben oder direkt JavaScript-Code schreiben. In vielen Fällen müssen wir den Code jedoch verbergen, um die Sicherheit des Codes zu gewährleisten.

HTML-Code-Ausblenden bezieht sich auf das Ausblenden des Inhalts in der HTML-Struktur, sodass er nicht direkt im Sichtfeld des Benutzers erscheint. Diese Technologie wird häufig auf einigen Websites verwendet, die vertraulich, geschützt und verborgen bleiben müssen, z. B. bei Online-Zahlungen, Kontobestätigungen usw. Wie kann man also HTML-Code verbergen?

1. Verwenden Sie CSS, um HTML-Code auszublenden.

Es gibt eine sehr nützliche Attributanzeige in CSS, mit der HTML-Code ausgeblendet werden kann. Wenn wir dieses Attribut verwenden, können wir display:none, Visibility:hidden, opacity:0, position:absolute + left:-9999px (Linksverschiebung 9999 Pixel) usw. verwenden, um den HTML-Code auszublenden.

1. display:none

display:none ist die am häufigsten verwendete Methode zum Ausblenden von HTML. Es kann Elemente ausblenden, sodass HTML-Code angezeigt werden kann vor Benutzern verborgen. Setzen Sie den Anzeigeattributwert des Elements auf „Keine“, um das Element auszublenden.

.hide {
    display: none;
}

2. visibility:hidden

visibility:hidden hat einen ähnlichen Effekt wie display:none. Der Unterschied besteht darin , Das Element bleibt an seiner ursprünglichen Position (der Platz wird nicht freigegeben) und wird entsprechend seiner ursprünglichen Größe belegt, ist aber nicht sichtbar.

.hide {
    visibility: hidden;
}

3. opacity:0

opacity:0 ist ein Filterattribut, das zum Festlegen der Transparenz der Elementsichtbarkeit verwendet wird. Auf 0 gesetzte Elemente sind vollständig transparent und für den Benutzer nicht sichtbar. Im Gegensatz zu „visibility:hidden“ wird der Platz an der ursprünglichen Position reserviert.

.hide {
    opacity: 0;
}

4. position:absolute + left:-9999px

position:absolute Positionierungsattribut kann die Position des Elements vollständig nach links verschieben, mit links: Der Attributwert von -9999px kann das Element vollständig ausblenden.

.hide {
    position: absolute;
    left: -9999px;
}

2. Verwenden Sie JavaScript, um HTML-Code auszublenden

Die JS-Methode zum Ausblenden von HTML-Code ist etwas komplizierter als CSS und muss über die JS-API implementiert werden. Beispielsweise können wir DOM verwenden, um Elemente im Dokument zu bedienen und Code über die Attribute setAttribute und style auszublenden. Der Code lautet wie folgt:

<div id="hide">需要隐藏的内容</div>
<script>
var hide = document.getElementById('hide');
hide.setAttribute('style', 'display:none'); 
</script>

Die Funktion des obigen Codes besteht darin, das Element mit der ID „hide“ auszuwählen und das Stilattribut des Elements auf „display:none“ zu setzen, was bedeutet, dass das Element verschwindet von der Seite.

3. Verschlüsselung und Verschleierung von HTML-Code

Zusätzlich zu den oben genannten Methoden gibt es eine sicherere Möglichkeit, den HTML-Code zu verschlüsseln, um mehr Sicherheit zu erreichen .

1. BASE64-Verschlüsselung

Durch die Verschlüsselung von HTML-Code mit Base64 kann eine höhere Vertraulichkeit erreicht werden. Base64-verschlüsselte Strings können zur Übertragung in Kommunikationsprotokollen wie URLs und HTTP-POST-Parametern verwendet werden, ohne dass Längenbeschränkungen berücksichtigt werden müssen. Durch Konvertieren der verschlüsselten Zeichenfolge in ein Zeichenkodierungsformat kann sie korrekt in HTML ausgegeben werden, wodurch der Code in HTML ausgeblendet wird.

var str = document.getElementById('demo').innerHTML;
//加密
var base64 = btoa(str);
//解密
var origin = atob(base64);
document.getElementById('demo').innerHTML = origin;

2. JS-Code-Verschleierung

JS-Code-Verschleierung bezieht sich auf die Verwendung einiger Mittel, um die Lesbarkeit von JS-Code zu verschlechtern und zu erhöhen Wie schwierig es ist gehackt werden. Die Verschleierung umfasst im Allgemeinen das Umbenennen von Funktionsnamen, das Umbenennen von Variablen, das Weglassen von Leerzeichen und Kommentaren usw. Durch die Verschleierung kann verhindert werden, dass Hacker Schwachstellen finden und Codes angreifen, indem der JS-Quellcode analysiert wird, wodurch die Sicherheit der Seite erhöht wird.

function hide() {
    var a = document.createElement('style');
    a.innerHTML = '.hide { display:none; }';
    document.head.appendChild(a);
}
hide();

Der obige Code erstellt dynamisch ein Style-Tag auf der Seite und setzt dessen innerHTML auf „.hide { display:none; }“, wodurch der Style dynamisch aus dem auf der Seite implementierten versteckten Code generiert wird.

Kurz gesagt ist die Technologie zum Ausblenden von HTML-Code sehr wichtig, um die Sicherheit der Website zu schützen. Die verschiedenen oben vorgestellten Methoden zum Ausblenden von HTML-Code haben ihre eigenen Vor- und Nachteile. Entwickler sollten sie entsprechend ihren eigenen Anforderungen auswählen und so die Sicherheitsschutzfunktionen der Seite verbessern.

Das obige ist der detaillierte Inhalt vonHTML-Code-Behind. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!