Mängu loomine JavaScriptiga võib olla nii lõbus ja rahuldust pakkuv kui ka pisut mõistatus. Selles artiklis olev kood on üks viise mängu loomiseks JavaScripti abil. Kui olete põhitõed selgeks saanud, kohanege ja mängige sellega ringi.
1 Seadistage oma programmeerimiskeskkond. Koodi kirjutamiseks vajate tekstitöötlusprogrammi. Saate selle kirjutada märkmiku dokumenti, kuid tõenäoliselt vajate programmeerimiseks mõeldud redaktorit, nagu Notepad++ (Windows), Atom (Mac) või Notepad (Linux). Kuid iga põhiline tekstiredaktor töötab.
2 Looge vajalikud failid. Teil on vaja kahte faili: ühte HTML-vormingus, mida brauser loeb, ja teist JavaScripti, mis on mäng.
3 Seadistage oma failid ja kaustad. Kuna teil on vaja ainult kahte faili, pole teil vaja mingit keerulist failisüsteemi. Kuni kaks faili on samas kaustas samal tasemel, see töötab. Nii et salvestage mõlemad failid samasse kohta. Html-vormingus salvestamiseks lisage html-laiend. Kasutame JavaScripti faili .js-laiendit. Seadistage oma failides kood. JavaScripti fail ei vaja seadistamist, kuid HTML seda teeb. Lisage oma HTML-dokumenti järgmine kood:
Lehe nimi See on põhiseade peaaegu iga HTML-i lehe jaoks. määrab brauseri jaoks koodi HTML-ina. ütleb brauserile, et kõik selles jaotises on kirjutatud HTML-is kui pole teisiti määratud. on jaotis, mis sisaldab teavet lehe kohta, näiteks pealkirja. on nimi, mis kuvatakse otsingutulemustes, ja nimi vahekaardil.
4 Alustage käivitusfunktsiooniga. Kõigepealt loote funktsiooni nimega start. Ülejäänud mängukood läheb sellesse funktsiooni. See on selleks, et saaksite oma HTML-lehel oleva nupu abil oma mängu alustada. Selle funktsiooni loob järgmine kood:var start = function(){ } See kood loob muutuja(var) nimega 'start':var start. See muutuja on funktsioon.Muutuja on võtmesõna, millele on määratud natuke andmeid, antud juhul funktsioon. Funktsioon on koodiosa, mida saab "kutsuda". Kui seda kutsutakse, käivitab see koodi oma {} sees. Seda selleks, et te ei peaks sama asja rohkem kui korra välja kirjutama.
5 Loo muutujad. Need muutujad sisaldavad/sisaldavad selliseid andmeid nagu skoor, küsimus ja kasutaja sisestus. Need lähevad sisse algusfunktsiooni {}.var right = 0;var incorrect = 0;var question = "noone";var input = "none";var answer = "none";correct: kasutajal on nii palju küsimusi vastas õigesti. vale: See on see, kui paljudele küsimustele kasutaja on valesti vastanud.question: See on küsimus, mis kasutajale esitatakse, see muutub iga uue küsimuse korral.sisend:Sellesse jääb kasutaja vastus või tema 'sisend'.vastus: See sisaldab õiget vastust küsimusele. Märkus. Kui kasutate muutujat, ei pea te varit kirjutama, vaid teete seda ainult muutuja tegemisel.
6 Kodeerige küsifunktsiooni. Küsi funktsioon küsib kasutajalt var küsimuse viipa kaudu. Viip on hüpikaken, mis nõuab kasutajalt vastuse sisestamist kasti. var ask = function(){ input = prompt(question);};Ask on muutuja, mis on funktsioon. Funktsioon määrab muutuja sisendi vastuseks muutujat küsimust sisaldavale viipale. Kokkuvõttes: funktsioon küsib kasutaja küsimus. Seejärel määratakse kasutaja vastuseks muutuja sisend. Nii et sisend on vastus, mille kasutaja sisestab.
7 Kodeerige skoori funktsioon. Hindefunktsioon reageerib sellele, kas kasutaja sisestus on õige või mitte. Seejärel reageerib see asjakohaselt. var score = function(){ if(sisend == vastus){ õige = õige+1; hoiatus("õige"); }else{ vale = vale+1; hoiatus("vale"); }};Muutuja skoor on funktsioon.kui muutuja sisend on võrdne muutuja vastusega (see on õige), parandab muutuja see võrdub iseendaga pluss üks.Ja see annab kasutajale hoiatuse, mis kõlab järgmiselt: 'õige'.else muutuja incorrect võrdub iseendaga pluss üks.Ja see annab kasutajale hoiatuse, mis ütleb: 'vale'.Kokkuvõtlikult: see funktsioon kontrollib, kas kasutaja sisestatud vastus on sama, mis tähendab, et see on õige. Kui on sobivus, suureneb õige summa ühe võrra ja see annab kasutajale märku, et tema vastus oli õige. Kui vastet ei leitud, suureneb valede arv ühe võrra ja see annab kasutajale märku, et vastus oli vale.
8 Lisage funktsioon kahe teise funktsiooni laisaks kutsumiseks. See muudab järgmise kirjutamise lihtsamaks. vari laisk = function(){ ask(); score();};Muutuja laisk on funktsioon.Käivitamisel kutsub see kahte funktsiooni: ask(); ja score();.Kokkuvõttes: see funktsioon lihtsalt kutsub kahte teist funktsiooni. See tähendab, et kui soovite helistada nii "küsi" kui ka "hinne", ei pea te neid eraldi helistama. võite lihtsalt nimetada "laisaks".
9 Kirjutage oma viktoriini sissejuhatus. See võib öelda mida iganes. See kood on lihtne tervitus. Te ei pea tervitama, kuid see võib kasutajale meeldiv olla.alert("tere tulemast minu viktoriinile, vastate 10 küsimusele.");
10 Määrake oma muutujad "küsimus" ja "vastus" küsimusele ja vastusele. Järgmine kood demonstreerib kuidas.question = "Mis on maatriks?";answer = "Lusikat pole";Singli = määrab paremal oleva asja vasakpoolsele muutujale. See tähendab, et muutujaküsimus sisaldab nüüd teksti(stringi)"Mis on maatriks?". Ja muutuja vastuses on tekst(string) "Ei ole lusikat".
11 Kutsuge funktsiooni "laisk". See funktsioon kutsub funktsioone "küsi" ja "skoor". lazy();Funktsioon 'ask' esitab kasutajale küsimuse ja salvestab kasutaja sisendi muutuja sisendisse. Funktsioon 'score' kontrollib, kas kasutaja sisestus vastab muutuja vastusele ning muudab muutujaid 'õige' ja 'vale' vastavalt.
12 Jätkake seda protsessi, et lisada rohkem küsimusi. Esmalt muutke muutuja 'question' oma uueks küsimuseks. Seejärel muutke muutuja "vastus" oma uue küsimuse õigeks vastuseks. Seejärel käivitage funktsioon ask.
13 Lõpetage mäng, kui teil on piisavalt küsimusi. See võib hõlmata nende skoori või õigete küsimuste protsendi ütlemist. Kui palju neid õigeks sai:alert("Hästi tehtud, sa said " + õige + " 10-st");
14 Mängu käivitamiseks tehke käivitusnupp. Alguses lõite funktsiooni nimega "start". Soovite, et viktoriin algaks ühe esitusnupu klõpsuga. Lisage HTML-i body-märgendisse järgmine kood.See lisab teie lehele nupu, millel on sõna „start”. Kui kasutaja sellel klõpsab, käivitab see funktsiooni "start". See funktsioon sisaldab mängu koodi.
15 Lisage oma mängu käsitlevale lehele tekst. Märgendi abil saate oma veebilehele lisada tasapinnalist teksti. Võid kasutajat hoiatada, et vastused on tõstutundlikud, või öelda, et head päeva jätku. Võite vabalt lisada kõike, mida soovite.
16 Testige oma mängu. Kas see töötab nii, nagu ootate?
17 Kohandage seda. Saate lisada rohkem küsimusi või sõnumeid, muuta HTML-i, et leht näeks kenamaks.