JS verwenden in HTML

louis Gast #4012926 
Ich habe leider keine Ahnung von JS, ich möchte lediglich ein 
vorhandenes Script nutzen, um etwas zu berechnen. Dabei habe ich ein .js 
file und einen Beispiel Code. Kann mir bitte jemand helfen, wie ich eine 
solche Variable im HTML Code darstellen kann?

Es geht um dieses Script
https://github.com/mourner/suncalc

1
var times = SunCalc.getTimes(new Date(), 51.5, -0.1);


Das sit ein Beispiel für eine Berechnung, deren Wert ich auf eine 
rWebseite brauche.

Danke
Antwort Zitieren Bearbeiten Thread verschieben Thread sperren Langsamer Modus Anmeldepflicht aktivieren Anpinnen Thread löschen Thread mit anderem zusammenführen Melden Danke
Achim H. #4013268 
indi schrieb:
> Geht mit document.writeln()

Hm, die Frage wäre, wo im Dokument das Ergebnis erscheint.

Das Problem ist ja, dass der Browser zuerst das HTML lädt, danach das 
JS-File und ggf. dort etwas ausführt. Da ist das Dokument ja schon 
fertig und wird (erstmal) fertig angezeigt ... Das Writeln würde ich 
daher am Ende des Dokumentes erwarten.

ZUr Ausgabe in Javascript fallen mir spontan 2,5 Möglichkeiten ein: Die 
eine geht über ein Popup mittels "alert(String)", die zweite geht über 
das nachträgliche Modifizieren des HTML-Dokumentes. Dazu muss über JS 
aber die richtige Stelle im HTML-"document" gefunden werden (Nummer 2,5 
ist die vollständige Erzeugung eines neuen HTML-Dokumentes).

Falls Du Englisch kannst, sollte Dir die folgende Seite einen guten 
Anhaltspunkt liefern:

http://www.w3schools.com/js/js_output.asp

Ein Vorteil von Javascript ist, dass fast alle Rechner bereits eine 
Interpretationsumgebung mitbringen (gemeint ist der Browser). Da kann 
man so etwas sehr leicht ausprobieren :)
Antwort Zitieren Bearbeiten Löschen Melden Danke
louis Gast #4013437 
Danke euch.

So wie ich das sehe, müsste das hier funktionieren, tut es aber nicht.
1
<!DOCTYPE html>

2
<html lang="de">

3
  <head>

4
    <meta charset="utf-8">

5
    <script type="text/javascript" src="suncalc.js"> </script> 

6
  </head>

7
  <body>       

8
    <script>

9
    sunrisePos = SunCalc.getPosition(times.sunrise, 51.5, -0.1);

10
    document.writeln(sunrisePos);

11
    </script> 

12
  </body>

13
</html>
Antwort Zitieren Bearbeiten Löschen Melden Danke
louis Gast #4013443 
Damit wird nichts ausgegeben:
sunrisePos = SunCalc.getPosition(times.sunrise, 51.5, -0.1);

Damit schon:
sunrisePos = 10

Das Skript funktioniert also nicht?
Antwort Zitieren Bearbeiten Löschen Melden Danke
Michael A. #4013449 
Hallo,

also eine Möglichkeit ist, den Ausgabeplatz in HTML mit einer ID zu 
versehen, also z.B.
1
<p id="xyz">hier solls hin</p>

Später wird dann im Script xyz.innerHTML = Resultat der Wert zugewiesen.
Dabei wird das "Hier solls hin" überschrieben.

So ungefähr sollte es hinkommen.

Nachtrag: falls das p-tag stört geht das div-tag, das macht keine 
Formatierung, kann also mitten im String einen Teilstring markieren.

Gruß,
Michael
Antwort Zitieren Bearbeiten Löschen Melden Danke
indi Gast #4013465 
Hallo louis,

hast Du Firefox? Dort gibt es eine Fehlerkonsole, in der Du die 
Fehlermeldungen siehst. So kannst Du Stück für Stück rausfinden, weshalb 
es nicht geht.

Punkt 1 war, dass times.sunrise nicht existierte. Punkt 2, dass 
sunrisePos keine Zahl, sondern ein Objekt ist. Ich hab's mal korrigiert. 
So geht es:


1
<!DOCTYPE html>

2
<html lang="de">

3
  <head>

4
    <meta charset="utf-8">

5
    <script type="text/javascript" src="suncalc.js"> </script> 

6
  </head>

7
  <body>       

8
    <script>

9
  var now = new Date();

10
    var sunrisePos = SunCalc.getPosition(now.getTime(), 51.5, -0.1);

11
    document.writeln(sunrisePos.azimuth);

12
    </script> 

13
  </body>

14
</html>
Antwort Zitieren Bearbeiten Löschen Melden Danke
Thread beobachten

Antwort schreiben

Eine eigene Frage? Dieser Thread ist über 11 Jahre alt. Stell sie in einem eigenen Thread – dort lesen mehr Leute mit, und sie wird öfter und schneller beantwortet.

Neuen Thread starten

Eine Lösung, Ergänzung oder Rückmeldung zu diesem Thread? Dann antworte hier.

Formatierung
  • [c]C-Code[/c]
  • [code]Code in anderen Sprachen, ASCII-Zeichnungen[/code]
  • [math]Formel in LaTeX-Syntax[/math]
  • [[Titel]] – Link zu einem Artikel
  • Verweis auf einen anderen Beitrag: Rechtsklick auf dessen Beitrags-ID (#8078628), „Adresse kopieren“, in den Text einfügen

Mehr zur Formatierung

Längeren Sourcecode als Anhang, nicht in den Text. JPG nur für Fotos und Scans; Zeichnungen und Screenshots als PNG oder GIF. Siehe Bildformate.

Dein Name und deine E-Mail-Adresse

Schon registriert? Anmelden

Wird nicht angezeigt. Wir schicken dir einen Link; sobald du damit bestätigst, erscheint dein Beitrag.

Mit dem Abschicken legst du einen kostenlosen Account an und erkennst die Nutzungsbedingungen und die Datenschutzerklärung an.