We call cross-site scripting XSS because CSS is already used.

Three types of cross-site scripting:
1. reflected XSS: https://www.youtube.com/watch?v=k91UNRymD0U

or just in any html page, include a button like this,
<a href=www.google.com/search=abc>click here</a>

And replace "abc" with a javascript.

2. persistent XSS: lab task 3,4,5.
3. DOM-based XSS: e.g., the Samy Worm.

DOM: Document Object Model

https://en.wikipedia.org/wiki/Document_Object_Model#/media/File:DOM-model.svg

(For task 6, document.getElementById("demo") allows you to access one element, and innerHTML() fetches only the HTML content of one element;)
See here for how innerhtml works.
https://www.w3schools.com/jsref/prop_html_innerhtml.asp

The Samy Worm

When a technically advanced 17 year old named Samy discovered an XSS vulnerability on MySpace, which at the time was the biggest social platform, he wanted to see how far the worm would go. The resulting chaos definitely surprised Samy, along with MySpace, the FBI and the security world: 1 million profiles were infected before MySpace fixed the issue, each showing the phrase “Samy is my hero” and adding Samy as a friend. 

https://en.wikipedia.org/wiki/Samy_(computer_worm)
https://www.youtube.com/watch?v=DtnuaHl378M

Defense for SQL injection and XSS: sanitizing user input;
Defense for CSRF: introducing random token.

Reference:

https://www.checkmarx.com/2015/04/14/xss-the-definitive-guide-to-cross-site-scripting-prevention/