美文网首页
节点的相关操作

节点的相关操作

作者: 轻风设计 | 来源:发表于2017-06-13 22:23 被阅读0次

创建一个节点我们通过createElement()

  var box = document.createElement('div');

添加节点,一般是这个被添加标签的父节点appendChild()

  obody.appendChild(box);

删除节点,一般删除这个节点也是通过他的父节点removeChild()

   obody.removeChild(box);

插入节点,插入到蓝色的小盒子之前,是通过父亲标签来操作insertBefore()

    box.insertBefore(insertBox,smallBox);
//childNodes:如果通过这种方式获取,会获取包括文本在内的所有的节点
//但是我们可以通过nodeType== 1来判定标签节点
  var myChilds =  box.childNodes; 
        var symNodes = [];
        for(var i = 0;i < myChilds.length;i ++){
            if(myChilds[i].nodeType == 1){
                symNodes.push(myChilds[i]);
            }
        }
        console.log(symNodes);
//以上方法不常用(即childNodes),用下列方法代替(即children)
//4.直接获取标签子节点
    var symNodes1 = box.children;

获取下一个兄弟节点,为了适配不同浏览器,

    var nextSym = btn1.nextElementSibling || btn1.nextSibling;

获取标签父亲节点

   var box = btn.parentNode;

相关文章

  • 节点的相关操作

    创建一个节点我们通过createElement() 添加节点,一般是这个被添加标签的父节点appendChild(...

  • JQuery---dom相关节点操作

    dom相关节点操作 /* DOM操作管理 属性...

  • ViewContainerRef 动态创建视图

    Angular DOM 操作 相关的APIs和类: 查询DOM节点template variable ref: 模...

  • jQuery相关API总结

    JQ操作DOM属性节点相关方法(包含类的操作) 属性节点就是指dom元素的属性 一般如果是标签自身自带的属性,我们...

  • dom节点和js相关操作

    文/michaelgbw dom节点对于我们weber都是非常熟悉的。我们的js一系列操作基本是基于这个来操作的。...

  • ElasticSearch的安装及简单配置

    操作步骤 启动单节点 安装插件 查看插件 查看安装的插件 配置多节点集群 查看集群 查看nodes 相关阅读 安装...

  • 启动Fabric网络

    启动Fabric网络 主要步骤包括计划拓扑、准备相关配置文件、启动Orderer节点、启动Peer节点和操作网络等...

  • kubernetes生产化集群管理

    生产化集群管理 计算节点相关 生产化集群的考量 计算节点 如何批量安装和升级计算节点的操作系统 如何管理和配置计算...

  • 链表相关

    总结一下链表相关的操作 单链表节点的定义 实现单向链表的反向 删除单链表的所有节点

  • HTMLday7总结

    属性操作 1.节点属性的增删改查 1)查a.节点.属性标签相关属性:innerHTML - 标签内容(包含双标签内...

网友评论

      本文标题:节点的相关操作

      本文链接:https://www.haomeiwen.com/subject/cnjrqxtx.html