星空网 > 软件开发 > Java

创建和删除节点:——核心DOM

 1. 创建单个元素节点:3步:
      1. 创建空元素节点对象:
         var elem=document.createElement("标签名");
        比如: var a=document.createElement("a");
          html: <a></a>
      2. 设置新元素的关键属性:
        比如: a.href="http://tmooc.cn";
              a.innerHTML="go to tmooc";
          html: <a href="http://tmooc.cn">go to tmooc</a>
      3. 将新节点挂到DOM Tree的指定父节点下:3种:
        追加:parent.appendChild(elem);
        插入:parent.insertBefore(elem,oldElem);
        替换:parent.replaceChild(elem.oldElem);
   2. 创建多个平级元素节点:3步:
      1. 先创建一个文档片段对象:
         var frag=document.createDocumentFragment();
         文档片段:内存中临时保存一个DOM子树的对象
         何时使用:只要添加多个平级节点时,都要先放入文档片段,再将文档片段整体挂到DOM Tree上
      2. 将子节点先放入文档片段
      3. 将文档片段整体挂到DOM Tree上
        文档片段本身不会出现在DOM Tree上,只会将元素加入DOM树

   3. 删除:parent.removeChild(子节点);
        子节点.parentNode.removeChild(子节点);

2. HTML DOM常用对象:
   1. Select对象:
      事件:onchange 选中项发生改变时
      属性:sel.selectedIndex 获得当前选中项的位置
            sel.options 获得sel下所有option元素对象
      方法:sel.add(opt) 将opt追加到sel下
            sel.remove(i) 删除sel下i位置的option元素
      Option对象:
      创建一个新option:var opt=new Option(text,value);
          相当于核心DOM三句话:
               var opt=document.createElement("option");
               opt.value=value;
               opt.innerHTML=text;
      属性:opt.index 获得当前opt所在的位置下标
            opt.text  opt.value: 分别获得innerHTML和value
            opt.selected: 判断当前opt是否被选中!
                 强调:opt的selected不是bool值!
                       但是却可直接作为条件判断

      创建option同时,追加到select中:
              sel.add(new Option(text,value));




原标题:创建和删除节点:——核心DOM

关键词:dom

dom
*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们: admin#shaoqun.com (#换成@)。

迪拜海外仓:https://www.goluckyvip.com/tag/30220.html
迪拜海外仓报价:https://www.goluckyvip.com/tag/30221.html
迪拜海运多少钱:https://www.goluckyvip.com/tag/30222.html
迪拜海运散货:https://www.goluckyvip.com/tag/30223.html
迪拜海运双清:https://www.goluckyvip.com/tag/30224.html
迪拜海运物流:https://www.goluckyvip.com/tag/30225.html
长治婚庆女司仪和主持人:https://www.vstour.cn/a/366176.html
北京丰台区水上乐园哪家好玩?:https://www.vstour.cn/a/366177.html
相关文章
我的浏览记录
最新相关资讯
海外公司注册 | 跨境电商服务平台 | 深圳旅行社 | 东南亚物流