zoukankan      html  css  js  c++  java
  • dom对象

    一般常用的几个dom对象的函数

    var oDiv =document.createElement("div");
    var text =document.createTextNode("baidu.com");
    oDiv.appendChild(text);
    var op=document.getElementById('ppp')
    document.body.insertBefore(oDiv,op);
          
    var pa=document.getElementById('pa');
    pa.appendChild(oDiv)
    

    小程序:自动增加一个1到10,用p标签

    <script>
    var i=1;
        var time1 = window.setInterval( function(){
        
        var pi=document.createElement('p');
        var text=document.createTextNode(i);
        pi.appendChild(text);
        document.body.appendChild(pi);
        i++;
           if (i==10)
           {
             clearInterval(time1);
            }
    
        }
        , 3000)
    </script>
    

    用dom实现9*9乘法表

    <script>
    window.onload=function ()
    {
        var table =document.createElement('table');
        var th =document.createElement('thead');
        var tb =document.createElement('tbody');
        var tf =document.createElement('tfoot');
        table.border="1px #333 solid";
          for(var i=0;i<9;i++)
          {
              tb.insertRow(i);
              for(var j=0;j<=i;j++)
              {
                tb.rows[i].insertCell(j);
                tb.rows[i].cells[j].appendChild(document.createTextNode((j+1)+' * '+(i+1)+' = '+((j+1)*(i+1)) +"   "));
              } 
          }
          table.appendChild(th);
          table.appendChild(tb);
          table.appendChild(tf);
          document.body.appendChild(table);
     
      }
    </script>
    

     通过dom改变样式

    window.onload=function()
    {
           var obj=document.createElement("div");
           obj.appendChild(document.createTextNode('测试内容'));
        // obj.setAttribute('style', 'color:#ffff;background:#900');
        // obj.setAttribute('id', 'o1');
        // document.body.appendChild(obj);
    
    
        obj.className='o1';
        // obj.style.cssText="background:red;300px;height:300px;";
        setTimeout(
    
            function ()
            {
                obj.className='obj2';
            }
            , 5000);
        document.body.appendChild(obj);
    
    }
    

      dom对象一般了解常用的函数就可以,要深入研究的,可以通过系统学习。谷歌度娘也行

  • 相关阅读:
    利用正則表達式排除特定字符串
    js面向对象编程:this究竟代表什么?
    js调用父级frame中的方法
    Cocos2d-x动画工具类
    BZOJ 2466 中山市选2009 树 高斯消元+暴力
    Android Intent Scheme URLs攻击
    XML基础(一)
    【Life】 Never Too Late, Just Do it Better!
    代理模式
    HDU--Elevator(水题)
  • 原文地址:https://www.cnblogs.com/biyongyao/p/5838219.html
Copyright © 2011-2022 走看看