首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > JavaScript >

js添加删除父节点,该如何处理

2012-04-21 
js添加删除父节点现在有一个:HTML codeselect ids1 size4 option valuekey0 text0/option

js添加删除父节点
现在有一个:

HTML code
   <select id="s1" size="4" >      <option value="key0" >text0</option>      <option value="key1" >text1</option>      <option value="key2" >text2</option>      <option value="key3" >text3</option>      <option value="key4" >text4</option>      <option value="key5" >text5</option>   </select>

我想在 <option>节点外 添加一个 <span style='display:none'></span> 来控制其 隐藏
并且还有可能 再将 这个<span style='display:none'></span> 去掉
那Js该如何使用DOM实现?
现提供 隐藏和现实的optin序号为2 即key2这行option
document.getElementById("s1").options[2]
如何隐藏 并重新显示

[解决办法]
HTML code
<!doctype html ><html><head>    <title> new document </title>    <script type="text/javascript">        function hide(n){            var sel = document.getElementById("s1");            var span = document.createElement("span");            span.style.display = "none";            span.id = "span" + n;            sel.insertBefore(span, sel.options[n]);            span.appendChild(sel.options[n]);        };        function show(n){            var sel = document.getElementById("s1");            span = document.getElementById("span"+n);            if(span){                sel.insertBefore(span.getElementsByTagName("option")[0], sel.options[n]);                sel.removeChild(span);            }        };    </script></head><body>    <select id="s1" size="4" >      <option value="key0" >text0</option>      <option value="key1" >text1</option>      <option value="key2" >text2</option>      <option value="key3" >text3</option>      <option value="key4" >text4</option>      <option value="key5" >text5</option>   </select>    <input type="button" value="隐藏" onclick='hide(2)' />    <input type="button" value="显示" onclick='show(2)' /></body></html> 

热点排行