动态增加hmt标签

 

 

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

    <title>欢迎光顾我的小小潇潇网站!</title>

    

</head>

<script language="javascript" type="text/javascript">

    function setAdd() {

         

        var sel = document.getElementsByName("checkbox");

        var ById = document.getElementById("setAdd");

        var txt = ById.options[ById.selectedIndex].text; //获取下拉列表中的text值(显示值)

        alert(txt);

        

          if (sel[0].checked.toString() == "true") {

                  document.getElementById(txt).innerHTML += "<br /><input type='text'/>";

             }

           if (sel[1].checked.toString() == "true") {     

                  document.getElementById(txt).innerHTML += "<br /><input type='checkbox'/>";

             }

           if (sel[2].checked.toString() == "true") { 

                document.getElementById(txt).innerHTML += "<br /> <select id='select'> <option>何乐为不为</option></select>";

             }

              

           if (sel[3].checked.toString() == "true") {

                   document.getElementById(txt).innerHTML += "<br /><input type='radio'/>";

             }

       

   }

   

    </script>

<body >

     <h2 >请完成以下添加任务:</h2>

       <input id="cbo1" type="checkbox" name="checkbox" />

        <input id="txt1" type="text" />       

        <br /><br />

    <input id="cbo2" type="checkbox" name="checkbox"  />

     <input id="ckb1" type="checkbox" name="checkbox1" />             

         <br /><br />

    <input id="cbo3" type="checkbox"name="checkbox" />

    <select id="slt1">

        <option></option>

        </select>

        <br /><br />

    <input id="cbo4" type="checkbox"name="checkbox" />

    <input id="rdo1" type="radio" name="radio1" /> 

    <br /><br />

     <input id="btn1" type="button" value="增加" />

   <select id="setAdd" >

       <option value="option1">a</option>

       <option value="option2">b</option>

       <option value="option3">c</option>

   </select>

       <div id="a" style="width:180;height:200;border:1px solid blue" >a层</div>

      <br />

       <div id="b" style="width:180;height:200;border:1px solid red" >b层</div>

       <br />

       <div id="c" style="width:180;height:200;border:1px solid orange" >c层</div>

      

</body>

</html>

 

本文出自 “学习交流” 博客,转载请与作者联系!

你可能感兴趣的:(标签,动态)