JavaScript笔记（4）

通过.style.xxx的形式只能访问内联的CSS样式

跨浏览器兼容

function getStyle(node. cssStyte ）｛
    return node. currentStyIe ？ node. currentStyI[cssStyte] : getComputedSty1e(node) [cssStyte] ;
｝

随机数

需要0-n的随机

parsnInt（Math.random() * (n+1）);

• 元素节点的属性

childNodes 访问当前节点下所有的子节点

firstChild 访问子节点中的首位

lastChiId 访问子节点中的最后一位

nextSibling 访问当前节点兄弟节点中的下一个节点

previousSibling访问当前节点兄弟节点中的上一个节点

【注意】 上述这些属性都包含文本节点

【注意】以下这些方法只获取子节点中的元素节点。

children

firstElementChild

lastElementChild

nextElementtSibling

previousElementSibling

	nodeType	nodeName	nodeValue
元素节点	1	标签名	null
属性节点	2	属性名	属性值
文本节点	3	#text	文本内容

【注意】空格、回车、换行 虽然看不见但是属于字符

• 节点操作

document.write()

【注意】会覆盖页面上原有的内容。

createElement(）

格式：document.createElement()

参数：标签名

返回值：创建好的这个节点

appendChild()

格式：node1.appendChild(node2);

功能：将node2节点插入到node1节点子节点的末尾

createTextNode(）

格式：document.createTextNode(文本）；

功能：创建文本节点（纯文本）

insertBefore()

格式：box1.parentNode.insertBefore(box2,box1)；

功能：将box2添加到box1前面

replaceChild（）

栳式：box1.parentNode.replaceChild(box2,box1）；

功能：用box2节点将box1替换

CloneNode()

格式：node.cloneNode()； 只克隆节点本身

格式2：node.cloneNode(true)；克隆节点本身和子节点

返回值：克隆出来的新节点

removeChild（）

格式：box.parentNode.removeChild(box)；

功能：将box节点从页面删除