JavascriptDOM programming example (smart podcast learning) _ javascript skills

Source: Internet
Author: User
I have been studying DOM programming for a long time. This is the most fulfilling part of my experience. Instructor Bi has carefully explained the relevant knowledge to us, I also found a lot of excellent web pages on the Internet as examples to explain to us and explain a lot of methods on how to learn DOM. I think it is really beneficial.
The following are some examples that I think are better.
1. Level-2 linkage drop-down menu (level-1 is a province, level-2 is a city, and level-1 is required to select a province, level-2 cities correspond to appear)
Step: 1) Basic Framework (HTML): There are two check boxes, and there should be no options in the second check box. Note that the first drop-down box will be used as the event source, the onchange method is used to stimulate the function implementation in JavaScript.

The Code is as follows:


<BR> <select id = "province" onchange = "selCity () "> <BR> <option> -- select a province -- </option> <BR> <option> Beijing </option> <BR> <option> Tianjin </option> <BR> <option> Hubei </option> <BR> <option> Shandong </option> <BR> <option> Hebei </option> <BR> </select> <BR> <select id = "city"> <BR> <option> -- select a city -- </option> <BR> </select> <BR>


2) There is no need to modify the page. You just need to display one in the drop-down menu.
3) JavaScript is used to implement the function. If you want to select a province from the first drop-down list, the corresponding city will be directly displayed, first, we thought of the map set container, but the JavaScrip does not have a map set. Then we thought of an array container and finally decided to use a two-dimensional array to help us implement this function.

The Code is as follows:


Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.