Javascript öppna sidan
•
Hur kopplar du in din JavaScipt-kod och hur kan du kolla att den är rätt?
<!doctype html> <metacharset=utf-8><title></title><style>h1 { color: green; } </style><h1></h1><p><ahref="#"onclick='alert("This is a message in a popup saying Hello World");'>Show an alert popup.</a></p><p><buttononclick='confirm("Press F12 to open the developer tools for your browser, select the console. Then reload the page and see the message in the console.");'>Show a confirm popup.</button></p><script>("<h3>This is a template!</h3>") ("Hello in the consol."); ("); ("Try writing 1+1 (at the bottom of the developer tool) and see what happens."); ("Try writing: ('Hi')"); var value = 42; ("Try writing: value"); </script>Nedan hänvisas det till Firebug. Firebug används inte längre, utan vi använder det inbyggda developer tools.
Det kan skilja lite i utseende, men det viktiga är att du år fliken console.
Ta en texteditor och spara koden i en fil som du döper till och öppna den i din webbläsare. Det ser ut så här.
Öppna Firebug genom att klicka F12 och välj flike
•
Resultatet kör vi i en webbläsare. Vi hanterar validering av din kod och vi ser var du hittar information som manualer och specifikationer.
Du får också se hur du bör göra för att få hjälp av andra genom att dela ut din kod och göra en fiddle.
#Förutsättning
Artikeln är en del av kurserna /dbjs och förutsätter att du har en labbmiljö som beskrivs i respektive kurs.
Du behöver också ha respektive kursrepo på plats.
#En sandbox för exempelprogram
En sandbox är en avskild testmiljö. Låt oss, som en övning, skapa en sandbox som du kan använda för dina testprogram i kursen.
Kika i kursmaterialet under . Där hittar du en struktur på en webbsida där sidans delar är separerade i olika filer.
$ tree sandbox/ sandbox/ ├── ├── └── 0 directories, 3 filesHär är en förklaring av de olika filerna.
| Fil | Innehåll |
|---|---|
| Sidans huvusakliga innehåll och HTML-koden | |
| Sidans style och CSS-kod | |
Studera filerna och se hur de länkas samman i via följande två rader.
<linkrel="stylesheet"href="style/"><scripttype=src="js/"></script>Var sak på sin plats är viktigt, det blir lättare att underhålla koden i längden på det viset.
Koden för sandbox-exemplet finns ä
•
Degui Adil / EyeEm / Getty Images
(URL, namn, specifikationer, ersätt)
URL-parameter
Utöver för att öppna en fönster kunna du även anpassa plats och ett av parametrarna. Koden nedan öppnar mot exempel en nytt öppning och anger dess utseende med hjälp av parametrar.
Ange webbadressen mot sidan vilket du önskar öppna inom det nya fönstret. angående du ej anger ett URL öppnas ett nytt tomt fönster:
("", "_blank", "toolbar = yes, top = , left = , width = , height = ");
Namn Parameter
Namnparametern anger målet för URL: n. för att öppna webbadressen i en nytt glasruta är standard och anges på detta sätt:
- _blank: Öppnar en nytt glasruta för URL: n.
andra alternativ ni kan nyttja är:
- _själv: Ersätter den aktuella sidan med URL: en.
- _förälder: Läser in webbadressen i den överordnade ramen.
- _topp: Ersätter varenda ramuppsättningar såsom har laddats.
Specifikationsparameter
Specifikationsparametern existerar där ni anpassar detta nya fönstret genom för att ange enstaka kommaavgränsad register utan vita mellanslag. Välj bland nästa värden.
- höjd = pixlar: Denna beskrivning ställer in höjden vid det nya fönstret inom pixlar. detta lägsta värdet som