Standard ie10 mode does not support HTC (HTML components). Upgrade and rewrite the original HTC Code 2: Event

The following is an example of HTC that has been widely used on the Internet, for example, ie10_htc.htc.

 <  Component  >  <  Public: attach  Event  = "Onmouseover"  Onevent  = "Hig_lite ()"   />  <  Public: attach  Event  = "Onmouseout"  Onevent = "Low_lite ()"   />  /* In fact, you can change it to the following statement *//*  <  Attach  Event  = "Onmouseover"  Handler  = "Hig_lite"  />  *//*  <  Attach  Event  = "Onmouseout"  Handler = "Low_lite"  />  */  <  Script  Type  = "Text/JavaScript"  >       Function  Hig_lite () {style. Color  =   255  ;} Function  Low_lite () {style. Color  =   0  ;}  </  Script  >  </  Component  > 

Ie10_htc.htmCode:

 <  Html >  <  Head  >      <  Title  ID  = "1"  > ASDF </  Title  >      <  Meta  HTTP-equiv  = "X-UA-compatible"  Content = "Ie = 9"   />      <  Style  >  H1  {  Behavior  :  URL (ie10_htc.htc)  }      </  Style  > </  Head  >  <  Body  >  <  H1  > Place the mouse here </  H1  >  </  Body  >  </  Html > 

There is a problem with running wood in ie9, but it is changed to ie10 in ie9, and then browsing with ie10 will find that the effect is useless.

It is not difficult to upgrade HTC. If you use pure JS, you can do this:

 <  Html  >  <  Head  >      <  Title  ID  = "1"  > ASDF </  Title  >     <  Meta  HTTP-equiv  = "X-UA-compatible"  Content  = "Ie = 9"   />      <  Script  Type  = "Text/JavaScript"  >          Function  Hig_lite (){  This . Style. Color  =   255  ;}  Function  Low_lite (){  This  . Style. Color  =   0  ;} Function  Loaded (){  VaR  Hi_arr  =  Document. getelementsbytagname (  "  H1  "  );  For (  VaR  I  =   0  ; I  <  Hi_arr.length; I  ++  ) {Hi_arr [I]. addeventlistener (  " Mouseover  "  , Hig_lite); hi_arr [I]. addeventlistener (  "  Mouseout  "  , Low_lite );}}  </  Script  >  </  Head  > <  Body  Onload  = "Loaded ()"  >  <  H1  > Place the mouse here </  H1  >  </  Body  > 

Because I no longer rely on HTC, it is okay to browse in ie9 and ie10. The effect is back, that is, the Code is a bit lengthy.

If jquery. JS is used for rewriting:

 < Html  >  <  Head  >      <  Title  ID  = "1"  > ASDF </  Title  >      <  Meta  HTTP-equiv  = "X-UA-compatible" Content  = "Ie = 9"   />      <  Script  SRC  = "Jquery-1.7.2.js"  Type  = "Text/JavaScript"  > </  Script  >      <  Script  Type  = "Text/JavaScript"  > $ (Document). Ready (  Function  () {$ (  "  H1  "  ). Mouseover (  Function  () {$ (  "  H1 "  ).Css (  "  Color  "  ,  "  Blue  "  ) ;}); $ (  "  H1 "  ). Mouseout (  Function  () {$ (  "  H1  "  ).Css (  "  Color  "  , "  Black  "  );});});  </  Script  >  </  Head  >  <  Body  >  <  H1 > Place the mouse here </  H1  >  </  Body  >  </  Html  > 

It seems a lot refreshed. At the same time, the color no longer supports numbers and must be expressed in English. It's good to see at a glance and know what it means.

We can conclude from the previous article (custom attributes) and this article (events) that, although Ms no longer supports HTC, it does not cost much to migrate it to Js, basically, the original code can be used, but some old HTC statements should be replaced with new ones!