# Quick Guide on HTML / Javascript / CSS

* Quick Tutorial on HTML / Javascript / CSS
* [W3.CSS](https://www.w3schools.com/w3css/default.asp)
* [Javascript](https://www.w3schools.com/js/)
* [HTML](https://www.w3schools.com/html/default.asp)
* [Bootstrap CSS Framework](https://www.w3schools.com/bootstrap/bootstrap_ver.asp)
* Tools
  * Visual Studio Code
  * Extension : Live Server

## Javascript Library

* [jQuery](https://www.w3schools.com/jquery/jquery_intro.asp)

* syntax : `$(selector).action()`
  * `$("p").hide()` : hide paragraph element
  * `$("#test").hide()` : hide element with id=test
  * `$(".test").hide()` : hide element with class=test
  * `$(this).hide()` : hide current element
  * [more...](https://www.w3schools.com/jquery/jquery_selectors.asp)

* [download](https://jquery.com/download/) and add this

  ```html
  <!-- use downloaded jQuery library -->
  <head>
  <script src="jquery-3.5.1.min.js"></script>
  </head>
  ```

  ```html
  <!-- use google CDN -->
  <head>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
  </head>
  ```

* Events
  * `.change()`
  * `.click()`
  * `.mouseenter()`
  * [more...](https://www.w3schools.com/jquery/jquery_events.asp)
  
* [AJAX](https://www.w3schools.com/jquery/jquery_ajax_intro.asp) (Asynchronous JavaScript and XML) : Exchange data with server

  * `$("#div1").load("demo.txt")`
  * `$.get(URL,data,callback)`
  * `$.post(URL,data,callback)`

* [References Overview](https://www.w3schools.com/jquery/jquery_ref_overview.asp)

