Implementation Code:
Copy codeThe Code is as follows:
<Select id = test11 size = 5 style = "width: 50px"> </select>
<Select id = "test" style = "width: 50px"> </select>
<Button onclick = 'test [test. length] = new Option ("1", "12"); '> Add both text and value </button>
<Button onclick = 'test. insertBefore (document. createElement ("option ")). innerText = "2"; '> operate on text </button> <button onclick = 'test. appendChild (document. createElement ("option ")). setAttribute ("value", "3"); '> operate on value </button>
<Button onclick = "alert (test. outerHTML)"> view </button>
<Button onclick = "test. removeChild (test. children [0])"> del1 </button>
<Button onclick = "test. firstChild. removeNode ()"> del2 </button>
<Button onclick = "test [0] = null"> del3 </button>
Demo:
<Select id = test11 size = 5 style = "width: 50px"> </select> <select id = "test" style = "width: 50px "> </select> <button onclick = 'test [test. length] = new Option ("1", "12"); '> Add both text and value </button> <button onclick = 'test. insertBefore (document. createElement ("option ")). innerText = "2"; '> operate on text </button> <button onclick = 'test. appendChild (document. createElement ("option ")). setAttribute ("value", "3"); '> operation on value </button> <button onclick = "alert (test. outerHTML) "> view </button> <button onclick =" test. removeChild (test. children [0]) "> del1 </button> <button onclick =" test. firstChild. removeNode () "> del2 </button> <button onclick =" test [0] = null "> del3 </button>
[Ctrl + A select all Note: If you need to introduce external Js, You need to refresh it to execute]