JS之DOM

2018-09-20  本文已影响0人  好奇的猫猫猫

获得当前子节点childNodes:把文本内容也当成了节点之一
文本内容也是属于节点的子节点
解决方法:使用children:包含了节点 不包含文本
获得标签的首个子节点:firstChild,获得的首节点是文本节点
firstElementChild:获得的真正的标签节点
注意:获得子节点分为两种
1.将文本内容也当成节点之一
childNodes
firstChild
lastChild
2.获得以标签为内容的子节点
children
firstElementChild
lastElementChild
获得当前节点的名称:nodeName
获得当前节点的父节点:parentNode
创建节点:createElement,--->创建完之后记得添加到指定节点:x.appendChild(y)是将标签添加到父标签的最后一个子节点
insertBefore(新标签,旧标签)添加到某个标签之前
replaceChild(新标签,旧标签)替换某个标签
removeChild()删除标签
document常用方法和属性:
常用属性:body
title
domain
url

var body = document.body;
console.log(body)

var title = document.title;
console.log(title)

//domain:域名
//http:通信协议
//www.baidu.com域名
var domain = document.domain;
console.log(domain)

var url = document.url;
console.log(url)

//标签的可视属性
var wrap = document.querySelector("#wrap");
console.log(wrap.id);
console.log(wrap.className);
console.log(wrap.style);
var img = document.querySelector("img");
img.src = "";
img.alt = "";
//添加额外的可视属性
wrap.setAttribute("hello","值");//设置属性
var value = wrap.getAttribute("hello")//得到属性
wrap.removeAttribute("hello")//移除属性
console.log(value)
//添加不可视的属性
wrap.name = "你好"
//1.offsetLeft,offsetTop,offsetWidth,offsetHeight
//2.clientWidth,clientHeight,scrollHeight,scrollWidth,scrollLeft,scrollTop

//offsetLeft,offsetTop,offsetWidth,offsetHeight是不包含margin的 
//clientWidth,clientHeight不包含border和margin
//scrollHeight,scrollWidth是可滚动范围
//scrollLeft,scrollTop设置滚动开始的位置
上一篇下一篇

猜你喜欢

热点阅读