លំហាត់​អនុវត្តន៍​អំពី DOM

សំណួរ

១. អ្វី​ទៅ​ហៅ​ថា DOM?
២. តើ DOM និង BOM ខុស​គ្នា​ដូចម្តេច​ខ្លះ?
៣. ដូចម្តេច​ដែល​ហៅ​ធាតុ​មេ (parent element) ធាតុ​រង (child element) និង​ធាតុ​ស្មើ​គ្នា (sublime element)?
៤. តើ​មាន​វិធី​អ្វី​ខ្លះ​នៅ​ក្នុង DOM ដែល​អាច​ត្រូវ​យក​មក​ប្រើប្រាស់ ក្នុង​ការភ្ជាប់​ទំនាក់ទំនង​ទៅ​នឹង​ធាតុ HTML?
៥. តើ​វិធី​អ្វី​ខ្លះ​ដែល​អាច​ត្រូវ​យក​មក​ប្រើ​ក្នុង​ការផ្លាស់ប្តូរ​តំលៃ CSS នៃ​ធាតុ HTML?

លំហាត់​អនុវត្តន៍

Task 1

Create an html page with a tree of subdirectories. When you click on an item of the list, it should collapse or expand. When you hover over an element, the font should become bold (using CSS).


Task 2

Create an html page for displaying/editing text.

When you open a page, the text is displayed with the div tag. When you press Ctrl+E, textarea appears instead of div containing the same text that you can now edit. When you press Ctrl+S, div appears instead of textarea with the text already changed. Do not forget to turn off the default behavior for these keyboard shortcuts.


Task 3

Create an html page with a large table. When clicking on the column heading, you need to sort data by this column. For example: in the screenshot, people are sorted by age. Note that numeric values should be sorted as numbers, not as strings.


Task 4

Create a calculator html page. Implement its features.


Task 5

Create an html page with a menu that has drop-down lists. A list with submenu items should appear by clicking on the corresponding menu item.


Task 6

Create an html page with a list of articles. When scrolling down the page by more than 100 pixels, the Up button should appear in bottom right corner to quickly jump to the top of the page.