Wie kann ich die Anzeige von zufällig ausgewählten text mit einem dazugehörigen Bild?

Ich bin ein Anfänger web-designer und ich muss wissen, wie kann ich einen link einer Sache zur anderen. Die Sache ist, dass ich verschiedene Zitate ändern sich jedes mal die Seite aktualisiert.
Und ich brauche die gleiche Sache zu tun mit Bildern, die sich in einem anderen div-tag. Der Grund, warum ich noch verlinkt werden muss, ist da das Bild muss in Abstimmung mit den zitieren.
Zum Beispiel: quote 0 mit Bild 0.

Hier ist der javascript-code:

var quotes=new Array();
quotes[0] = "text1";
quotes[1] = "Text2";
quotes[2] = "text3";
quotes[3] = "text4";

var q = quotes.length;
var whichquote=Math.round(Math.random()*(q-1));
function showquote(){document.write(quotes[whichquote]);}
showquote();

- Und dies ist der code, der sich die javascript-text:

<script language="javascript" type="text/javascript" src="quotes.js"></script>

Es klingt nicht wie Sie link JavaScript in JavaScript. Es klingt wie Sie haben, um die Koordinierung der JavaScript-und was immer es ist, die Erzeugung der Bilder.
Danke!!! Und wissen Sie, wie kann ich das machen?
Zur info (da du neu bist bei JavaScript): Es gibt fast nie einen Grund für die Verwendung new Array. Verwenden Sie ein array-literal. In diesem Fall: pastie.org/8137855 Getrennt, die language Attribut veraltet in den 90er Jahren, und der Standardwert von type auf script ist text/javascript. Also einfach <script src="..."></script> ist alles, was Sie brauchen. Sorry, und Ihre zufällige Zahl ist falsch. Sie möchten =Math.round(Math.random() * q), nicht q-1.
Benutzer: Es ist unmöglich zu sagen, Sie haben nicht gezeigt, alles sagt uns, wie die Bilder ausgewählt werden.
Die Sache ist, dass ich immer noch nicht weiß, wie kann ich die Bilder, und ich kann nicht finden, ein tutorial.

InformationsquelleAutor nastiark | 2013-07-13

7

Einige Hinweise auf diesen code. Nicht nehmen diese in die falsche Richtung, Sie sind mit JavaScript! Jeder war einmal, dass die Menschen Dinge aufzuzeigen, ist eine Möglichkeit, wie wir lernen.
1. Gibt es fast nie einen Grund für die Verwendung new Array. Verwenden Sie ein array-literal. In diesem Fall:
```
var quotes = [
    "text1",
    "Text2",
    "text3",
    "text4"
];
```
2. Den language Attribut veraltet in den 90er Jahren, und der Standardwert von type auf script ist text/javascript. Also einfach <script src="..."></script> ist alles, was Sie brauchen.
3. Ihre zufällige Zahl ist falsch. Math.random gibt eine Anzahl von 0 (inklusive) zu 1 (exklusive), so dass Sie wollen, multiplizieren Sie einfach durch die Anzahl der Bilder, nicht die Zahl minus eins.
4. document.write ist am besten vermieden werden. Es gibt sehr, sehr wenig Grund, es zu benutzen in der modernen web-Programmierung.
Hier ist ein Weg, das zu tun, was du beschrieben hast: Live-Beispiel | Live-Quelle

(Sie haben, um es zu aktualisieren ein wenig, denn es hat nur zwei Einträge, damit haben Sie ziemlich gute Chancen zu sehen, die gleiche.)
```
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>Random Text Plus Image</title>
</head>
<body>
  <div id="quote"></div>
  <script>
    (function() {
      var quotes = [
        {
          text: "text1",
          img:  "http://i.stack.imgur.com/FqBE6.jpg?s=32&g=1"
        },
        {
          text: "text2",
          img:  "https://www.gravatar.com/avatar/ca3e484c121268e4c8302616b2395eb9?s=32&d=identicon&r=PG",
        }
      ];
      var quote = quotes[Math.floor(Math.random() * quotes.length)];
      document.getElementById("quote").innerHTML =
        '<p>' + quote.text + '</p>' +
        '<img src="' + quote.img + '">';
    })();
  </script>
</body>
</html>
```
Was ich da getan habe:
- I Ausgang ein element, das <div id="quote"></div> zu halten, das Zitat und Bild. Diese ist anstelle der document.write.
- Habe ich ein array-literal, aber mein array-literal enthält Objekt Literale (die {...} Dinge mit text: "text1" und so). Also mein array enthält Objekte, wobei jedes Objekt hat die Eigenschaften text (der text, der das Zitat) und img (die URL des Bildes zu verwenden).
- Ich der festen zufällige Sache.
- Beim ausgeben der text (was ich davon ausgehen ist HTML-markup) und das Bild, dass ich von der Einstellung innerHTML auf die quote div ich die Ausgabe über den code.
- Habe ich alle meine code in einer umschließenden Funktion, rufe ich sofort. Dies verhindert, dass die Schaffung einer globalen Variablen.
Hoffe, das hilft.
- Vielen Dank für die Hilfe, die Sie uns zur Verfügung stellen, um mich und nehmen Sie sich Zeit und erklären! Ich hoffe, ich kann lernen besser und ein wirklich guter Profi! Die Antworten, die Sie mir gab, hat mir sehr geholfen! 🙂 Ich hoffe jeder hat einen schönen Tag.
InformationsquelleAutor T.J. Crowder

Vorausgesetzt, Sie haben so etwas wie den folgenden html-Code:

<div id="quote"></div>
<div>
    <img class="image" src="http://www.placehold.it/100x50&text=1" />
    <img class="image" src="http://www.placehold.it/100x50&text=2" />
    <img class="image" src="http://www.placehold.it/100x50&text=3" />
    <img class="image" src="http://www.placehold.it/100x50&text=4" />
</div>

- und css -

.image {
   display: none;
}

Dann müssen Sie etwas tun, wie dieses in Ihrem showquote Funktion:

function showquote(){
   document.getElementById('quote').innerHTML = quotes[whichquote];
   document.getElementsByTagName('img')[whichquote].style.display="block";
}