js生成span

来源:互联网 发布:图像故障诊断算法 编辑:程序博客网 时间:2024/05/17 20:33
  1. <html>  
  2. <head>  
  3.     <title>Javascript Create Span Using Document CreateElement Dynamically</title>  
  4.     <style type="text/css">  
  5.         .dynamicSpan {  
  6.             font-size: 11px;  
  7.             font-family: verdana;  
  8.             color: Orange;  
  9.         }  
  10.     </style>  
  11.     <script type="text/javascript" language="javascript">  
  12.     <![CDATA[ 
  13.         function createSpan() { 
  14.             var spanTag = document.createElement("span"); 
  15.  
  16.             spanTag.id = "span1"; 
  17.  
  18.             spanTag.className = "dynamicSpan"; 
  19.  
  20.             spanTag.innerHTML = "<b>HTML Span tag</b> " 
  21.                                 + "created by using "  
  22.                                 + "Javascript DOM dynamically."; 
  23.  
  24.             document.body.appendChild(spanTag); 
  25.         } 
  26.     ]]>  
  27.     </script>  
  28. </head>  
  29. <body>  
  30.     <center>  
  31.         <b>Click this button to create Span Tag dynamically:</b>  
  32.         <input id="btn1"   
  33.                 type="button"   
  34.                 value="create span"   
  35.                 onclick="createSpan();" />  
  36.     </center>  
  37.     <br />  
  38. </body>  
  39. </html> 
0 0
原创粉丝点击