JavaScript - Diese Webseite teilen

- Für Chromium-Browser (Microsoft Edge, Google Chrome, Opera) und Mozilla Firefox (96).


<!DOCTYPE html>

<html lang="de">
 <head>
  <meta charset="UTF-8">
  <title>JavaScript - Diese Webseite teilen - Werner-Zenk.de</title>
  <meta name="description" content="JavaScript - Diese Webseite teilen (Share Button).">
 </head>
<body>

<style>
button#teilen {
 
font-familyVerdanaArialSans-Serif;
 
font-size1.1rem;
}

button#teilen::before {
 
contentUrl("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAOCAYAAADwikbvAAABuElEQVR42mOQkJbllJBV4BSXkeeUkFHglJCW4xQUEWdnQALKyirTVFQ1NK1t7BiRxRkkZeT+iUhIvxUWl3orLCb1VkRM8i2fgPCB+KRURgsrG+7I6Fg9MUnpO1KyCp/kFZTyDY2MeeCaRcUkvjOgAVc3DwljM8sGRRX1a0CX/JGUlf8vKavwH8j+p6quedLK2ta8urqamUFEVBxFc2BQiJGcgvIpkGJcWEJS5r2Ojk4timZZeQUheSXV09g0SMkpQjTKKPxXVFZ9raWlVQTXHBuXwKijZ1ApKSMP0/AX6NxPQPqDhIz8H6jYT6DfVwcGh5qCbYNp1tLW5ZGWVTgLVPhPRkHpioaWTr6ymqaloqqGkbCo+HUpWfn7Wjp6WUqq6hxwP8I029k7qkhKy/4BhvxeGXklOeRwUFBSabCxtdeVlVeSkZaR1cTQrGdgFCwuJftKVV1DDz303dw9WUC0uIR0sqi4xBQMzfwCApHyisq9DHiAmLhkMlA9pubQ0PB6XV1dHbI0V1ZWB7a0tDCRpFlMXAqsedmyFXg1wvwsIobkZ2CS+y8mLfdNHIZlkDCKmPw3oLpfyJoBTSOL9FTr/0kAAAAASUVORK5CYII=");
}
</
style>

<
p>
<
button id="teilen"Diese Webseite teilen</button>
</
p>

<
script>
const 
btn document.querySelector("#teilen");
const 
title document.title;
const 
text document.getElementsByName("description")[0].getAttribute("content");
const 
url document.URL;
const 
shareData = {
 
title: `${title}`,
 
text: `${text}`,
 
url: `${url}`
}

btn.addEventListener("click"async () => {
  
await navigator.share(shareData);
});
</
script>

➤ Im Dokument müssen die HTML-Tags: <title>Seitentitel</title> und <meta name="description" content="Beschreibung"> vorhanden sein.

Bausteine  Alle Anzeigen

Eine zufällige Auswahl von Codeschnipseln aus den Bereichen HTML, CSS, PHP, JavaScript und MySQL.

<dialog> Dialog Element

CSS - Fehleingaben in Formularen mit CSS hervorheben

PHP - Verzeichnisgröße auslesen

JavaScript - Interne Anker hervorheben

MySQL - Bei doppelter HOST-Adresse in der Tabelle warnen

Homepage Testen
Wenn Ihre Seite fertig sind und ins Internet hochgeladen wurden, gilt es: Testen, testen, testen. Viele Fehler kann man Offline finden, manche aber nur Online (zum Beispiel vergessene Dateien, falsche Links). Von großem Wert ist auch ein Test seitens einer Person, welcher die Seite unbekannt ist.
Meist fallen Schönheitsfehler und Hindernisse auf, die man als Webmaster nicht mehr sieht. Hierbei hilft es, der Testperson Aufgaben zu stellen, zum Beispiel, eine bestimmte Information zu finden oder ein bestimmtes Produkt zu bestellen.