DOM (Document Object Model)
How many times you saw applications in past where even if you click on some of the buttons or select items from List box and complete page is refreshed. Basically at each such event execution requests is being initiated to server and server responds with complete HTML code to client browser.
Is not this tedious? Why to load complete HTML page with thousands of tags for each request. Instead what if there is a way where we can only update specific TAG within the HTML code without loading the whole page?
By manipulating the DOM,
1. You can create applications that update the data of the page without needing a refresh.
2. You can create applications that are customizable by the user and then change the layout of the page without a refresh.
Key Points in DOM,
1. Page loaded in the application contains thousands of HTML TAGS consider these are all Object.
Website which loads the flight tickets, you can select the source and destination and click on search, post which request sent to server for retrieving price.
For key methods in DOM Refer : https://www.w3schools.com/js/js_htmldom_document.asp
|Querying the Tags using DOM Methods|
DOM Based XSS Attack :
|Reference : excess-xss.com|
1. Attacker Crafts URL with XSS payload
2. Sends the link to Victim
3. Victim executes link
4. Request sent to Server
5. Using DOM method - document.queryselector content from parameter "keyword" are getting updated in the page without appropriate validation.
Before updating the response using queryselector there should be appropriate validation of the string being passed.