|
1 |
| -# Hello, world! |
| 1 | +# Witaj, świecie! |
2 | 2 |
|
3 |
| -This part of the tutorial is about core JavaScript, the language itself. |
| 3 | +Ta część samouczka dotyczy głównych funkcjonalności samego języka JavaScript. |
4 | 4 |
|
5 |
| -But we need a working environment to run our scripts and, since this book is online, the browser is a good choice. We'll keep the amount of browser-specific commands (like `alert`) to a minimum so that you don't spend time on them if you plan to concentrate on another environment (like Node.js). We'll focus on JavaScript in the browser in the [next part](/ui) of the tutorial. |
| 5 | +Zanim jednak będziemy w stanie uruchamiać nasze skrypty, potrzebujemy środowiska do pracy. Skoro czytasz tę książkę online, idealnie do tego nada się twoja przeglądarka. Ograniczymy komendy przeglądarkowe (np. `alert`) do minimum, aby oszczędzić ci czasu na ich naukę, jeśli planujesz skoncentrować się na innym środowisku (jak np. Node.js). JavaScript działający w przeglądarce omówimy w [następnej części](/ui) tego samouczka. |
6 | 6 |
|
7 |
| -So first, let's see how we attach a script to a webpage. For server-side environments (like Node.js), you can execute the script with a command like `"node my.js"`. |
| 7 | +Na początek zobaczmy, jak podpiąć skrypt do naszej strony. W środowiskach serwerowych (np. Node.js) skrypty wykonuje się poprzez komendę, np. `"node moj_skrypt.js"`. |
8 | 8 |
|
9 | 9 |
|
10 |
| -## The "script" tag |
| 10 | +## Znacznik "script" |
11 | 11 |
|
12 |
| -JavaScript programs can be inserted into any part of an HTML document with the help of the `<script>` tag. |
| 12 | +Programy napisane w JavaScripcie można wrzucić do dowolnej części dokumentu HTML za pomocą znacznika `<script>`. |
13 | 13 |
|
14 |
| -For instance: |
| 14 | +Na przykład: |
15 | 15 |
|
16 | 16 | ```html run height=100
|
17 | 17 | <!DOCTYPE HTML>
|
18 | 18 | <html>
|
19 | 19 |
|
20 | 20 | <body>
|
21 | 21 |
|
22 |
| - <p>Before the script...</p> |
| 22 | + <p>Kod przed skryptem...</p> |
23 | 23 |
|
24 | 24 | *!*
|
25 | 25 | <script>
|
26 |
| - alert( 'Hello, world!' ); |
| 26 | + alert( 'Witaj, świecie!' ); |
27 | 27 | </script>
|
28 | 28 | */!*
|
29 | 29 |
|
30 |
| - <p>...After the script.</p> |
| 30 | + <p>... i za skryptem.</p> |
31 | 31 |
|
32 | 32 | </body>
|
33 | 33 |
|
34 | 34 | </html>
|
35 | 35 | ```
|
36 | 36 |
|
37 | 37 | ```online
|
38 |
| -You can run the example by clicking the "Play" button in the right-top corner of the box above. |
| 38 | +Aby uruchomić przykład, kliknij na przycisk "Play" w prawym górnym rogu. |
39 | 39 | ```
|
40 | 40 |
|
41 |
| -The `<script>` tag contains JavaScript code which is automatically executed when the browser processes the tag. |
| 41 | +Znacznik `<script>` zawiera kod javascriptowy, który jest automatycznie wywoływany, kiedy przeglądarka przetwarza jego zawartość. |
42 | 42 |
|
43 | 43 |
|
44 |
| -## Modern markup |
| 44 | +## Nowoczesna składnia |
45 | 45 |
|
46 |
| -The `<script>` tag has a few attributes that are rarely used nowadays but can still be found in old code: |
| 46 | +Znacznik `<script>` posiada kilka atrybutów, których współcześnie się nie używa, a na które można się natknąć w starym kodzie: |
47 | 47 |
|
48 |
| -The `type` attribute: <code><script <u>type</u>=...></code> |
49 |
| -: The old HTML standard, HTML4, required a script to have a `type`. Usually it was `type="text/javascript"`. It's not required anymore. Also, the modern HTML standard totally changed the meaning of this attribute. Now, it can be used for JavaScript modules. But that's an advanced topic; we'll talk about modules in another part of the tutorial. |
| 48 | +Atrybut `type`: <code><script <u>type</u>=...></code> |
| 49 | +: Stary standard HTML, czyli HTML4, wymagał, aby skrypty miały określony typ (`type`). Zwykle było to `type="text/javascript"`. Obecnie nie jest on już wymagany. Ponadto, w aktualnym standardzie HTML całkowicie zmieniło się jego znaczenie - teraz stosuje się go przy modułach javascriptowych. Ale to zaawansowany temat. O modułach będziemy mówić w innej części samouczka. |
50 | 50 |
|
51 |
| -The `language` attribute: <code><script <u>language</u>=...></code> |
52 |
| -: This attribute was meant to show the language of the script. This attribute no longer makes sense because JavaScript is the default language. There is no need to use it. |
| 51 | +Atrybut `language`: <code><script <u>language</u>=...></code> |
| 52 | +: Ten atrybut służył do określenia języka skryptu. Obecnie nie ma on większego sensu, ponieważ JavaScript jest domyślnym językiem. Nie trzeba go używać. |
53 | 53 |
|
54 |
| -Comments before and after scripts. |
55 |
| -: In really ancient books and guides, you may find comments inside `<script>` tags, like this: |
| 54 | +Komentarze przed i za skryptem |
| 55 | +: W pradawnych książkach i poradnikach możesz natknąć się na komentarze wewnątrz znacznika `<script>`, takie jak ten: |
56 | 56 |
|
57 | 57 | ```html no-beautify
|
58 | 58 | <script type="text/javascript"><!--
|
59 | 59 | ...
|
60 | 60 | //--></script>
|
61 | 61 | ```
|
62 | 62 |
|
63 |
| - This trick isn't used in modern JavaScript. These comments hide JavaScript code from old browsers that didn't know how to process the `<script>` tag. Since browsers released in the last 15 years don't have this issue, this kind of comment can help you identify really old code. |
| 63 | + W nowoczesnym JavaScripcie nie stosuje się już tego triku. Służył on do ukrywania kodu JavaScript przed przeglądarkami, które nie umiały przetwarzać znacznika `<script>`. Jednak z racji tego, że wszystkie przeglądarki z ostatnich 15 lat nie mają już tego problemu, taki komentarz pomoże ci jedynie rozpoznać bardzo, bardzo stary kod. |
64 | 64 |
|
65 | 65 |
|
66 |
| -## External scripts |
| 66 | +## Zewnętrzne skrypty |
67 | 67 |
|
68 |
| -If we have a lot of JavaScript code, we can put it into a separate file. |
| 68 | +Kiedy kod skryptu nam się rozrośnie, możemy go umieścić w osobnym pliku. |
69 | 69 |
|
70 |
| -Script files are attached to HTML with the `src` attribute: |
| 70 | +Pliki skryptowe dołącza się do HTML-a za pomocą atrybutu `src`: |
71 | 71 |
|
72 | 72 | ```html
|
73 |
| -<script src="/path/to/script.js"></script> |
| 73 | +<script src="/ścieżka/do/skryptu.js"></script> |
74 | 74 | ```
|
75 | 75 |
|
76 |
| -Here, `/path/to/script.js` is an absolute path to the script from the site root. One can also provide a relative path from the current page. For instance, `src="script.js"` would mean a file `"script.js"` in the current folder. |
| 76 | +W tym przykładzie `/ścieżka/do/skryptu.js` to ścieżka bezwzględna do pliku, licząc od katalogu głównego strony. Można jednak podać ścieżkę względną, liczoną od położenia aktualnej strony. Na przykład, `src="skrypt.js"` odnosi się do pliku `"skrypt.js"` w tym samym folderze. |
77 | 77 |
|
78 |
| -We can give a full URL as well. For instance: |
| 78 | +Oprócz tego mamy możliwość podania pełnego adresu URL, na przykład: |
79 | 79 |
|
80 | 80 | ```html
|
81 | 81 | <script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/3.2.0/lodash.js"></script>
|
82 | 82 | ```
|
83 | 83 |
|
84 |
| -To attach several scripts, use multiple tags: |
| 84 | +Jeśli chcesz dodać kilka skryptów, wstaw więcej znaczników: |
85 | 85 |
|
86 | 86 | ```html
|
87 |
| -<script src="/js/script1.js"></script> |
88 |
| -<script src="/js/script2.js"></script> |
| 87 | +<script src="/js/skrypt1.js"></script> |
| 88 | +<script src="/js/skrypt2.js"></script> |
89 | 89 | …
|
90 | 90 | ```
|
91 | 91 |
|
92 | 92 | ```smart
|
93 |
| -As a rule, only the simplest scripts are put into HTML. More complex ones reside in separate files. |
| 93 | +Kieruj się zasadą, że tylko proste i krótkie skrypty powinny trafić bezpośrednio do pliku HTML. Te bardziej skomplikowane należy wydzielać do osobnych plików. |
94 | 94 |
|
95 |
| -The benefit of a separate file is that the browser will download it and store it in its [cache](https://en.wikipedia.org/wiki/Web_cache). |
| 95 | +Korzyścią z takiego podejścia jest fakt, że przeglądarka pobierze ten plik i zapisze w swojej [pamięci podręcznej](https://en.wikipedia.org/wiki/Web_cache). |
96 | 96 |
|
97 |
| -Other pages that reference the same script will take it from the cache instead of downloading it, so the file is actually downloaded only once. |
98 |
| -
|
99 |
| -That reduces traffic and makes pages faster. |
| 97 | +Inne strony, które również korzystają z tego samego pliku, wczytają go z pamięci podręcznej, zamiast ponownie go pobierać. Dzięki temu plik ze skryptem jest pobierany tylko raz. Zmniejsza to zużycie łącza i przyspiesza wczytywanie strony. |
100 | 98 | ```
|
101 | 99 |
|
102 |
| -````warn header="If `src` is set, the script content is ignored." |
103 |
| -A single `<script>` tag can't have both the `src` attribute and code inside. |
| 100 | +````warn header="Jeśli znacznik ma ustawiony atrybut `src`, jego zawartość jest ignorowana." |
| 101 | +Pojedynczy znacznik `<script>` nie może mieć jednocześnie atrybutu `src` i kodu wewnątrz znacznika. |
104 | 102 |
|
105 |
| -This won't work: |
| 103 | +Taki kod nie zadziała: |
106 | 104 |
|
107 | 105 | ```html
|
108 |
| -<script *!*src*/!*="file.js"> |
109 |
| - alert(1); // the content is ignored, because src is set |
| 106 | +<script *!*src*/!*="plik.js"> |
| 107 | + alert(1); // ten kod jest ignorowany, bo ustawiono 'src' |
110 | 108 | </script>
|
111 | 109 | ```
|
112 | 110 |
|
113 |
| -We must choose either an external `<script src="…">` or a regular `<script>` with code. |
| 111 | +Musimy wybrać, czy chcemy wczytać zewnętrzny skrypt za pomocą `<script src="…">`, czy wykonać kod zawarty wewnątrz `<script>`. |
114 | 112 |
|
115 |
| -The example above can be split into two scripts to work: |
| 113 | +Powyższy przykład można rozbić na dwa skrypty: |
116 | 114 |
|
117 | 115 | ```html
|
118 |
| -<script src="file.js"></script> |
| 116 | +<script src="plik.js"></script> |
119 | 117 | <script>
|
120 | 118 | alert(1);
|
121 | 119 | </script>
|
122 | 120 | ```
|
123 | 121 | ````
|
124 | 122 |
|
125 |
| -## Summary |
| 123 | +## Podsumowanie |
126 | 124 |
|
127 |
| -- We can use a `<script>` tag to add JavaScript code to a page. |
128 |
| -- The `type` and `language` attributes are not required. |
129 |
| -- A script in an external file can be inserted with `<script src="path/to/script.js"></script>`. |
| 125 | +- Znacznik `<script>` służy do dodawania kodu javascriptowego do strony. |
| 126 | +- Atrybuty `type` i `language` nie są wymagane. |
| 127 | +- Zewnętrzny skrypt z pliku wczytujemy za pomocą `<script src="ścieżka/do/skryptu.js"></script>`. |
130 | 128 |
|
131 | 129 |
|
132 |
| -There is much more to learn about browser scripts and their interaction with the webpage. But let's keep in mind that this part of the tutorial is devoted to the JavaScript language, so we shouldn't distract ourselves with browser-specific implementations of it. We'll be using the browser as a way to run JavaScript, which is very convenient for online reading, but only one of many. |
| 130 | +To tylko wierzchołek góry lodowej, jeśli chodzi o skrypty przeglądarkowe i ich interakcje ze stroną. Pamiętajmy jednak, że ta część samouczka jest poświęcona językowi JavaScript, dlatego nie powinniśmy mieszać sobie w głowach implementacjami właściwymi tylko dla przeglądarek. Do uruchamiania kodu javascriptowego będziemy używać przeglądarki, co jest wygodne podczas czytania online, ale to tylko jeden z wielu sposobów. |
0 commit comments