Native javascript learning: Baidu Input Method

Today, we used javascript to implement the Baidu Input Method drop-down menu demo: http://cssplusplus.com/demo/js/2_?baiduinput0.htmlsource code :01&lt ;! DOCTYPEhtml & gt; 02 & lt; html & gt; 03 & lt; head & gt; 0405 & lt; style & gt; 06 * {marg

Today, we use javascript to implement the Baidu Input Method drop-down menu.
Demo: http://cssplusplus.com/demo/js/2_1_baiduInput0.html
Source code:
01
02
03
04
05
16
17 script
18 window. onload = function (){
19 var obtn = document. getElementsByTagName ("button") [0];
20 var omenu = document. getElementById ("menu ");
21 omenu. style. display = "none ";
22 obtn. onclick = function (){
23 if (omenu. style. display = "none "){
24 omenu. style. display = "block ";
25} else {
26 omenu. style. display = "none ";
27}
28}
29}
30 script
31
32
33
34
35Input Method
36

37
• Handwriting

38
• Pinyin

39
• Close

40

41
42
43
Note that if there are no 21 rows of statements:
1 omenu. style. display = "none ";
Omenu. style. display will be equal to a null value. Then, click the button. if it is determined for the first time, it will be false to enter the else statement so that omenu. style. display = "none ". In other words, you must click twice at the first click to make the menu appear.
In javascript, the style method is used for objects, and the style in css is not modified, but the style can be refreshed with the highest priority.

Author: Li yuhao