JavaScriptの動かし方

1. “ ”

3. JavaScript

5. JS …

7. Web

10. browser Server (^o^)

12. Web

15. browser Server

16. … browser Server

17. browser Server

18. 1 browser Server …

19. browser Server

22. HTML

23. Web

24. GET index.html browser Server <html> … Hello … </html>

26. <html> <head> <link rel="stylesheet" href="style.css" /> </head> <body> <img src="hello.png" alt="Hello" /> <img src="world.png" alt="World" /> <script src="script.js"></script> </body> </html>

31. <html> <head> <link rel="stylesheet" href="style.css" /> </head> <body> <img src="hello.png" alt="Hello" /> <img src="world.png" alt="World" /> <script src="script.js"></script> </body> </html>

32. HTML

34. CSS

36. <link rel="stylesheet" href="style.css" /> … browser Server body { color: red; }

39. <img src="hello.png" /> browser Server hello.png

40. <img src="world.png" /> 1 browser Server … world.png

44. JS

45. <script src="script.js"></script> browser Server … alert('Hello, world'); …

46. JS

47. HTML CSS

48. Web

49. HTML

50. <html> <head> <link rel="stylesheet" href="style.css" /> </head> <body> <h1>Hello</h1> <script src="script.js"></script> </body> </html>

51. index.html

54. CSS

55. h1 { color: red; }

56. style.css

59. JS

60. script.js

61. window.addEventListener('load', function() { if (conﬁrm('green?')) { document .querySelector('h1') .style.color = 'green'; } }, false);

65. OK

66. /* function() {} */ window.addEventListener('load', function() { } }, false);

67. /* green? OK {} */ if (conﬁrm('green?')) { }

68. // <h1> document .querySelector('h1') .style.color = 'green';

70. JS

71. JS HTML CSS…

JavaScriptの動かし方

Recommended

Recommended

More Related Content

What's hot

What's hot (18)

JavaScriptの動かし方

Editor's Notes