Knowledge Points:
0, why should innertext? Because of security.
1. Extended properties for the Firefox DOM model
2, the Currentstyle property can get the actual style state
3, IE implemented innertext when the display mode, if the block is added line
4, why not textcontent? Because Textcontent does not consider the element display way, so not completely with IE compatible
Code: Tests are passed under ie6,7,8 and Firefox 2,3.
<ptml> <pead> <script language= "JavaScript" >//if your browser is IE, return true. If is others, like Firefox, return false. function Isie () {//ie? if (Window.navigator.userAgent.toLowerCase (). IndexOf ("MSIE") >=1) return true; else return false; //if is Firefox and we need to rewrite its innertext attribute. if (!isie ()) {//firefox innertext define HTMLELEMENT.PROTOTYPE.__DEFINEGETTER__ ("InnerText", function () {var anystring = ""; var ChildS = this.childnodes; for (var i=0 i<childs.length; i++) {if (childs[i].nodetype==1) anystring = = childs[i].tagname== "BR"? ' \ n ': childs[i].textcontent; else if (childs[i].nodetype==3) anystring + = Childs[i].nodevalue; return anystring; } ); htmlelement.prototype.__definesetter__ ("InnerText", function (stext) {this.textcontent=stext; } ); function Getselectedtext (name) {var Obj=document.getelementbyid (name); for (i=0;i<obj.length;i++) {if (obj[i].selected==true) {return obj[i].innertext; }} function Chk () {var objtext = Getselectedtext ("Myselect"); Alert ("seleted option ' s text is:" +objtext); var Objvalue=document.getelementbyid ("Myselect"). Value; Alert ("seleted option ' s value is:" +objvalue); } </script> </pead> <body> <select id= "Myselect" > <option value= "1111" >my 1111 HAHAHA&L t;/option> <option value= "2222" >my 2222</option> "<option value=" 3333 >My <option value= "4444" >my 4444</option> </select> <input type= "button" name= "button" value= " Result "onclick=" javascript:chk (); > </body> </ptml>
[Ctrl + A All SELECT Note: If the need to introduce external JS need to refresh to perform]
Of course, if the dropdown box alone, you can not rewrite the innertext, with the following code can be implemented. Overriding innertext is intended to be compatible with HTML elements other than the dropdown box.
<textarea id="runcode44176"><ptml> <pead> <script language= "JavaScript" > function chk () {//var objtext = Getselectedtext (" Myselect "); var obj = document.getElementById ("Myselect"); var objtext = Obj.options[obj.selectedindex].text alert ("seleted option ' s text is:" +objtext); var Objvalue=document.getelementbyid ("Myselect"). Value; Alert ("seleted option ' s value is:" +objvalue); } </script> </pead> <body> <select id= "Myselect" > <option value= "1111" >my 1111 HAHAHA&L t;/option> <option value= "2222" >my 2222</option> "<option value=" 3333 >My <option value= "4444" >my 4444</option> </select> <input type= "button" name= "button" value= " Result "onclick=" javascript:chk (); > </body> </ptml></textarea>
[Ctrl + A All SELECT Note: If the need to introduce external JS need to refresh to perform]