javascript的dom练习代码参考

代码

   
     

    
      
    
      <!
    
      DOCTYPE html PUBLIC 
    
      "
    
      -//W3C//DTD XHTML 1.0 Transitional//EN
    
      "
    
       
    
      "
    
      http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd
    
      "
    
      >
    
      

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

    
      <
    
      head
    
      >
    
      

    
      <
    
      meta http
    
      -
    
      equiv
    
      =
    
      "
    
      Content-Type
    
      "
    
       content
    
      =
    
      "
    
      text/html; charset=gb2312
    
      "
    
       
    
      /
    
      >
    
      

    
      <
    
      title
    
      >
    
      无标题文档
    
      <
    
      /
    
      title>
    
      

    
      <
    
      style type
    
      =
    
      "
    
      text/css
    
      "
    
      >
    
      

    
      *
    
      { padding:0px; margin:0px}

    
      <
    
      /
    
      style>
    
      

    
      <
    
      /
    
      head>
    
      

    
      <
    
      body
    
      >
    
      

    
      <
    
      script type
    
      =
    
      "
    
      text/javascript
    
      "
    
      >
    
      
window.onload
    
      =
    
      function
    
      (){
 
 
    
      var
    
       bodyTag
    
      =
    
      document.body 
    
      ||
    
       document.documentElement ;
 bodyTag.style.height
    
      =
    
      '
    
      5000px
    
      '
    
      ;
 
 
    
      var
    
       areaA
    
      =
    
      document.createElement(
    
      '
    
      div
    
      '
    
      );
 areaA.setAttribute(
    
      '
    
      id
    
      '
    
      ,
    
      '
    
      areaA
    
      '
    
      );
 areaA.style.width
    
      =
    
      '
    
      300px
    
      '
    
      ;
 areaA.style.height
    
      =
    
      '
    
      290px
    
      '
    
      ;
 areaA.style.overflow
    
      =
    
      '
    
      hidden
    
      '
    
      ;
 areaA.style.padding
    
      =
    
      '
    
      5px
    
      '
    
      ;
 areaA.style.margin
    
      =
    
      '
    
      5px
    
      '
    
      ;
 areaA.style.border
    
      =
    
      '
    
      solid
    
      '
    
      ;
 areaA.style.borderWidth
    
      =
    
      '
    
      1px
    
      '
    
      ;
 areaA.style.borderColor
    
      =
    
      '
    
      red
    
      '
    
      ;
 
 
    
      var
    
       leftSideBar
    
      =
    
      document.createElement(
    
      '
    
      div
    
      '
    
      );
 areaA.setAttribute(
    
      '
    
      id
    
      '
    
      ,
    
      '
    
      leftSideBar
    
      '
    
      );
 
 
    
      var
    
       leftSideBarH4
    
      =
    
      document.createElement(
    
      '
    
      h1
    
      '
    
      );
 leftSideBarH4.style.lineHeight
    
      =
    
      '
    
      40px
    
      '
    
      ;
 leftSideBarH4.style.fontSize
    
      =
    
      '
    
      20px
    
      '
    
      ;
 leftSideBarH4.style.background
    
      =
    
      '
    
      #eee
    
      '
    
      ;
 leftSideBarH4.color
    
      =
    
      '
    
      black
    
      '
    
      ;
 leftSideBarH4.style.paddingLeft
    
      =
    
      '
    
      25px
    
      '
    
      ;
 leftSideBarH4.style.border
    
      =
    
      '
    
      solid
    
      '
    
      ;
 leftSideBarH4.style.borderWidth
    
      =
    
      '
    
      2px
    
      '
    
      ;
 leftSideBarH4.style.borderColor
    
      =
    
      '
    
      red
    
      '
    
      ;
 leftSideBarH4.style.marginBottom
    
      =
    
      '
    
      15px
    
      '
    
      ;
 
 
    
      var
    
       para
    
      =
    
      document.createElement(
    
      '
    
      p
    
      '
    
      );
 
    
      var
    
       paraText
    
      =
    
      document.createTextNode(
    
      '
    
      目前，十大评选已进入倒计时决胜阶段，但近日投票监测系统发现部分企业存在多次违规投票行为，组委会对其提出警告及核减刷票票数，但屡禁不止，为维护公平竞争，用户满意的原则，现对部分违观投票企业采取取消评选资格，望广大参评企业引以为戒，请勿采取极端手段进行投票，谢谢合作。
    
      '
    
      );
 para.appendChild(paraText);
 para.style.textIndent
    
      =
    
      '
    
      24px
    
      '
    
      ;
 
 
    
      var
    
       leftSideBarH4Text
    
      =
    
      document.createTextNode(
    
      '
    
      参加展会
    
      '
    
      );
 leftSideBarH4.appendChild(leftSideBarH4Text);
 leftSideBar.appendChild(leftSideBarH4);
 
 
 leftSideBar.appendChild(para);
 areaA.appendChild(leftSideBar);
 bodyTag.appendChild(areaA); 
}

    
      <
    
      /
    
      script>
    
      

    
      <
    
      /
    
      body>
    
      

    
      <
    
      /
    
      html><
    
      /
    
      font
    
      >
    
      

    
      <
    
      a href
    
      =
    
      "
    
      http://js.alixixi.com/
    
      "
    
      >
    
      欢迎访问阿里西西网页特效代码站，js.alixixi.com
    
      <
    
      /
    
      a>