• 博客园logo
  • 会员
  • 众包
  • 新闻
  • 博问
  • 闪存
  • 赞助商
  • HarmonyOS
  • Chat2DB
    • 搜索
      所有博客
    • 搜索
      当前博客
  • 写随笔 我的博客 短消息 简洁模式
    用户头像
    我的博客 我的园子 账号设置 会员中心 简洁模式 ... 退出登录
    注册 登录
不见花落
博客园    首页    新随笔    联系   管理    订阅  订阅
javascript——10章 DOM

1、节点关系

(1)childNodes:返回节点的子节点集合

返回值:NodeList 对象,表示节点集合。

注:childNodes只能取到子级,不能取到子级的子级。

childNodes所有节点有相同的父节点

每个节点相互之间是同胞节点。


(2)parentNode属性:节点的父节点

(3)previousSibling属性:节点的同胞节点第一个节点

(4)nextsibling属性:节点的同胞节点最后一个节点

(5)hasChildNodes()方法:在李点包含一个或多个子节点时返回true.

(6)ownerDocument属性:所有节点最后一个属性,表示整个文档的文档节点。


2、节点操作

(1)var fragment = document.createDocumentFragment();ul.appendChild(fragment);创建文档片段——再将节点加到“文档片段”;

var fragment = document.createDocumentFragment();
var ul = document.getElementById("myList");
var li = null;
            
for (var i=0; i < 1; i++){
   li = document.createElement("li");
   li.appendChild(document.createTextNode("Item " + (i+1) + "111111111"));
   fragment.appendChild(li);
}
            
ul.appendChild(fragment);

(2)document.createElement  创建节点:

var div = document.createElement("div");

(2)id = "myNewDiv";  创建节点的ID名称:

div.id = "myNewDiv";

(3)className = "box"; 创建节点的class名称:

div.className = "box";

(4)document.body.appendChild(div);把节点添加到父节点:

document.body.appendChild(div);

(5)document.createTextNode("Item ");创建节点文本:

li.appendChild(document.createTextNode("Item " + (i+1) + "111111111"));

 

posted on 2018-01-02 16:32  不见花落  阅读(161)  评论(0)    收藏  举报
刷新页面返回顶部
博客园  ©  2004-2025
浙公网安备 33010602011771号 浙ICP备2021040463号-3