XML schön in HTML darstellen?

4 Antworten

Vom Fragesteller als hilfreich ausgezeichnet

Wenn du die Elemente mit XSLT triggerst, dann kannst doch ganz gewöhnlich html-Kode da einfügen. An jeder Stelle. Kannst es ja z.b. durch eine unsichtbare Tebelle lösen

Danke für den Stern!

0

Lies dich ein bisschen in PHP ein und lass das XML von PHP parsen, damit kannst du zB das XML in HTML Code umwandeln, oder wenn du die Tags auch sehen willst kannst du das so auch realisieren.

Zudem wäre vielleicht auch dieser Thread interessant für dich:

http://www.coding-board.de/threads/xml-in-html-anzeigen.29206/

<?xml-stylesheet type="text/css" href="stylesheet.css"?>

einfach mit css stylen.

Wie kann ich ein Javascript in HTML einbinden?

Also ich, m 14, interessiere mich nun sehr für Informatik. Nur bekomme ich echt Aids, wenn ich den Fehler in dem Code finde. Ich würde es echt schätzen, wenn jemand diese Nachricht lesen und beantworten würde. Nun, da ich diese Frage so schnell wie möglich stellen will, stelle ich den HTML-Code in den Text. Ich würde mich über freundliche Hilfe freuen - M14

HTML-Code:

<!doctype html>
<html>
  <head>
    <meta charset="utf-8" />
    <script href="start.js" type="javascript"></script>
    <link rel="stylesheet" href="rasstart.css" type="text/css">
    <title>Realschule am Stadtpark</title>
 https://use.fontawesome.com/releases/v5.3.1/js/all.jseases/v5.3.1/js/all.js" integrity="sha384-kW+oWsYx3YpxvjtZjFXqazFpA7UP/MbiY4jvs+RWZo2+N94PFZ36T6TFkc9O3qoB" crossorigin="anonymous"></script>
  </head>
  <body>
    <div id="überdie">
      <header>
        <img src="bilder/bilderyan/hammer.png" alt="Logo von der RAS">
        <div id="navi">
          <nav>
            <ul>
              <li><a href="startseite.html">Startseite</a></li>
              <li><a href="animation.html">Wir über uns</a></li>
              <li><a href="termine.html">Termine</a></li>
              <li><a href="algifo.hrml">Algemeine Informationen</a></li>
              <li><a href="schulprof.html">Schulprofil</a></li>
              <li><a href="abschluss_seite.html">Abschluss - und was dann?</a></li>
              <li><a href="unterricht.html">Unterricht</a></li>
              <li><a href="schülzeitung.html">Schülerzeitung</a></li>
              <li><a href="downl_serv.html">Downloads/Service</a></li>
              <li><a href="archiv.html">Archiv</a></li>
            </ul>
        </div>
        <div class="search-box">
          <input class="search-txt" type="text" name="" placeholder="Suchbegriff eingeben">
          <a class="search-btn" href="#">
            <i class="fas fa-search"></i>
          </a>
        </div>
      </header>
      <section>
        <div class="article">
          <img src="" alt="">
          <a>Mal Wettbewerb 2016</a>
            <p> Kleines Kind was ich nicht kenne, Elif und ein anderes Kind <br>was ich nicht kenne haben den Mal Wettbewerb gewonnen</p>
            <br>
          </div>
          <div class="article2">
            <img src="bilder/bild2.png" alt="">
            <a>Bleibendes Schild 2014</a>
            <p>Endlich! <br>
               &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp das Schild hängt und bleibt erst mal so</p>
            <br>
          </div>
          <div class="article3">
            <img src="bilder/bilder3.png" alt="">
            <a>Wir Erforschen das große Thema<br>&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp Roboter</a>
            <p>Dank dem Industrie von BKO haben wir viel über Roboter erfahren und gelernt.&
              <br>
          </div>
        </section>
        <aside><aside/>
        <footer>
          <img src="bilder/bilderyan/banner.png" alt="B Systems">
        </footer>
        <script src="scripts/start.js"></script>
  </body>
</html>
...zur Frage

json Daten in JavaScript auslesen und an html Elemente weiterleiten?

Hi,

mehr schlecht als recht arbeite ich mich gerade durch json und habe tatsächlich mittlerweile herausfunden, dass man zum Laden einer json-Datei ohne jQuery folgenden Ansatz zu brauchen scheint:

function loadJSON(callback) {var xobj = new XMLHttpRequest();
xobj.overrideMimeType("application/json"); xobj.open('GET', 'data.json', true); // Replace 'my_data' with the path to your file xobj.onreadystatechange = function () { if (xobj.readyState == 4 && xobj.status == "200") { // Required use of an anonymous callback as .open will NOT return a value but simply returns undefined in asynchronous mode callback(xobj.responseText); } }; xobj.send(null);

}

Wie ich damit dann allerdings Objekte und values auslese und weiterleite, ist mir schleierhaft.

Hier ist erst einmal der json Code

{"employees":
    [
        {
            "firstName": "John", 
            "lastName": "Doe"
        },
        {
            "firstName":"Anna", 
            "lastName":"Smith"
        },
        {
            "firstName":"Peter", 
            "lastName":"Jones"
        }
    ]
}

Meine Idee war ja etwas wie document.getElementbyID oder halt byClassName, um den Content im DOM zu verteilen. Aber irgendwas scheint mir zu fehlen.

Pseudocode mäßig wäre halt sowas schön: getElementbyID('title').data(firstName[0]) Irgendwie so halt ...

Was ich bisher gefunden habe, waren nur Kurzeinleitungen, wie ich den Code in der Konsole ausspucke, js Arrays erstelle (warum auch immer die Leute das in einem json Tutorial als Lösung anbieten) oder html Elemente in JavaScript mit dem json Inhalt erstelle. Wie gesagt, würde ich jedoch gerne den json Inhalt an meine bereits existierenden html Elemente weitergeben.

ps. Wenn ihr dazu eine jade-Lösung habt, wäre das natürlich noch um so prickelnder.

...zur Frage

WFS Layer mit OpenLayers einbinden?

Ich möchte einen WFS-Layer vom GeoServer mithilfe von OL einbinden, dabei habe ich mich an das Beispiel von OpenLayers (vectorWFSgehalten.

Mein Code sieht wie folgt aus (URLs wurden maskiert wegen GF):

<!DOCTYPE html>
<html>
  <head>
    <title>WFS</title>
    <meta charset="UTF-8">
    <link href="htt ps://openlayers.org/en/v4.6.4/css/ol.css" rel="stylesheet" type="text/css">
    <script src="htt ps://openlayers.org/en/v4.6.4/build/ol.js"></script>
  </head>
  <body>
    <div id="map" class="map"></div>
    <script>
	var vectorSource = new ol.source.Vector({
	   format: new ol.format.GeoJSON(),
	   url: function(extent) {
	      return 'htt p://osmatrix.geog.uni-heidelberg.de/geoserver/' +
		'wfs?version=1.1.0&request=GetFeature&typename=fdepasquale:fdepasquale_countries&maxFeatures=5000&' +
		'outputFormat=application%2Fjson&srsname=EPSG:4326&' +
		'bbox=' + extent.join(',') + ',EPSG:4326';
	   }
	});
			
	var vector = new ol.layer.Vector({
	   source: vectorSource,
	   style: new ol.style.Style({
	      stroke: new ol.style.Stroke({
	         color: 'rgba(0, 0, 255, 1.0)',
		 width: 2
	      })
	   })
	});
			
	var map = new ol.Map({
	    layers: [vector],
	    target: document.getElementById('map'),
	    view: new ol.View({
	       center: [-8908887.277395891, 5381918.072437216],
	       maxZoom: 19,
	       zoom: 12
	    })
	});
    </script>
  </body>
</html>

Leider bekomme ich keinen Layer angezeigt (Chrome) und die Konsole spuckt folgendes aus:

Uncaught SyntaxError: Unexpected token < in JSON at position 0at JSON.parse (<anonymous>)
  at Lo (ol.js:473)
  at Qq.k.Qa (ol.js:473)
 at U.<anonymous> (ol.js:471)

Ich bin totaler Neuling und muss diese Aufgabe für die Uni absolvieren. Vielleicht weiß jemand, was ich falsch gemacht habe.

Die Zoom-Buttons von der Map werden übrigens angezeigt.

...zur Frage

Was möchtest Du wissen?