Come Randomizza script YouTube Playlist

June 12

Se avete visto i video di YouTube incorporato in una pagina Web, ancora non può sapere che è possibile incorporare le playlist pure. Un giocatore playlist di YouTube riproduce tutti i video memorizzati nella playlist. Aggiungere una playlist alla pagina Web incollando il codice playlist generata da YouTube nel documento HTML. Un modo interessante per aggiungere varietà alla tua pagina è quello di creare uno script generatore di playlist casuale. Le pagine Web possono utilizzare lo script per visualizzare una playlist diverso ogni volta che un visitatore del sito carica la pagina o il clic su un pulsante.

istruzione

copia Playlist

1 Visita YouTube e sul proprio nome utente di YouTube che appare nell'angolo in alto a destra di qualsiasi pagina di YouTube. Le playlist vengono visualizzate nella parte superiore della pagina.

2 Clicca una delle playlist. Il primo video della playlist inizia a suonare. Fare clic sul pulsante "Condividi" sotto il video player. Viene visualizzato un pulsante "Embed".

3 Fare clic sul pulsante "Embed" e copiare il testo playlist che si vede nella casella di testo che appare sotto il pulsante. Aprire il blocco note e incollare il testo in un nuovo documento.

4 Fare clic su un'altra playlist e quindi fare clic su uno dei video in quella playlist. Fare clic sul pulsante "Condividi", fai clic su "Incorpora 'e copiare il testo che appare nella casella di testo. Incollare il testo playlist sotto il testo incollato in Blocco note in precedenza.

Aggiungere a pagina Web

5 Aprire un editor di testo o qualsiasi editor HTML. Incollare il seguente codice nella sezione body del documento:

<Div id = "1" class = "hidden">

</ Div>

<Div id = "2" class = "hidden">

</ Div>

<Input type = valore "pulsante" = "Mostra caso Playlist" onclick = "tornare showRandom ( '2')" />

Questo crea due blocchi div HTML. Ogni blocco terrà una delle playlist copiati da YouTube. Ogni blocco div fa riferimento a una classe CSS di nome "nascosto". Che classe CSS rende ogni div invisibile. Si noti che ogni div ha anche un identificatore univoco id numerico. L'ID per la prima div è "1". id del secondo div è 2. Il tag input crea un pulsante. Il suo evento click chiama la "showRandom" funzione JavaScript e passaggi che funzionano un numero. Questo numero rappresenta il numero di brani che hai nella pagina. Tale numero è 2 in questo esempio. Se tu avessi le playlist aggiuntive sulla pagina, si dovrebbe passare il numero totale di brani alla funzione.

6 Copiare la prima playlist si è incollato in Blocco note nella riga vuota che compare nel primo blocco div. Copiare la seconda playlist nella riga vuota che compare nel secondo blocco div. Dopo aver fatto questo, il codice potrebbe apparire come illustrato di seguito in questo esempio:

<Div id = "1" class = "hidden">
<Iframe width = "420" height = "315" src = "http://www.youtube.com/embed/JxZI0Cxaq20
<Iframe>
</ Div>

<Div id = "2" class = "hidden">
<Iframe width = "420" height = "315"
src = "http://www.youtube.com/embed/s-c8X52Qg4o&quot;>
</ Iframe>
</ Div>

7 Incollare il codice riportato di seguito nella sezione di stile del documento:

<Div id = "1" class = "hidden">

Ciò crea la classe "nascosto" fa riferimento div nel passaggio precedente.

8 Incollare il seguente codice JavaScript nella sezione dello script del documento:

Funzione showRandom (numberOfPlaylists) {
var divObject;
for (var i = 1; i <= numberOfPlaylists; i ++) {
var divObject = document.getElementById (i);
divObject.style.display = "none";
}

var = rand Math.floor (Math.random () * numberOfPlaylists + 1);
var divObject = document.getElementById (rand);
divObject.style.display = "blocco";
}

Questa funzione JavaScript genera un numero casuale e lo memorizza nella variabile "rand". E poi fa una delle tue playlist nascosti appaiono in base al valore memorizzato nella variabile.

9 Salvare il documento e visualizzarlo nel browser. Fare clic sul pulsante che appare sulla pagina. Un video player di YouTube contenente una delle tue playlist. Fare clic sul pulsante più volte. Quando si fa clic, il codice genera un nuovo numero casuale e visualizza le playlist diverse in base al valore del numero casuale generato. .

Consigli e avvertenze

  • Questo esempio mostra come includere due playlist randomizzati sulla vostra pagina Web. Per aggiungere un altro elenco di riproduzione, aggiungere un terzo blocco div alla sezione corpo del documento, come mostrato in questi passaggi, e incollare il codice playlist da un'altra playlist di YouTube all'interno di quella div. Set ID che di div a 3. Modificare il numero in caso pulsante di scatto 2-3 pure. Il numero che si passa alla funzione in questo evento click del pulsante deve sempre essere uguale al numero di blocchi div visualizzati nel documento HTML. Utilizzando questo modello, è possibile aggiungere le playlist che vi piace la vostra pagina web.
  • Per creare una playlist diversa appare ogni volta che un utente visita la pagina Web, chiamare la funzione showRandom all'interno dell'evento "onload" della tua pagina.