码迷,mamicode.com
首页 > 其他好文 > 详细

DOM 基础(一)

时间:2017-06-10 15:15:02      阅读:156      评论:0      收藏:0      [点我收藏+]

标签:代码   组成   属性   name   ntb   style   class   cto   关系   

DOM(document object model)由节点构成,元素节点,文本节点,属性节点是一份DOM的所有组成。

<p id="p">this is a node</p>

上面代码分解:

    <p></p>是一个元素节点,this is a node是文本节点,id="p"是属性节点。

三种节点关系:

    文本节点和属性节点必须放在元素节点中,但元素节点未必包含文本节点和属性节点。

获取元素

    获取元素有三种方式标签名或id,class,返回的是有着给定id、class、tagName的元素节点对应的对象。

    getElementById("id")是document特有的方法,函数名后面必须有括号,括号中传入id值,id放在单引号或双引号中。

类似有document.getElementsByTagName(),document.getElementsByClass(),不同的是这两个函数返回对象数组,有length属性,可通过元素节点对象来调用

document.getElementsByTagName()接受的参数包括通配符*,为了让通配符与乘法操作符*区分,通配符必须放在""中。

document.getElementsByClass()可接收多个类名,用空格隔开,如"className1 className2",要求匹配同时带有两个类名的元素,类名的顺序不影响匹配结果

CSS控制DOM样式

selector{
    property:value;
}

 

    selector可以表示元素节点,通过标签名或者元素属性(id||class)来表示,{}中设置样式,这些样式不仅作用于直接包含在selector中的元素,由于子节点会继承父节点的样式,因此还作用于嵌套在selector内部的所有元素。

获取和设置属性

    getAttribute,setAttribute,这两个方法不属于document对象,只能通过元素节点对象调用。

 

DOM 基础(一)

标签:代码   组成   属性   name   ntb   style   class   cto   关系   

原文地址:http://www.cnblogs.com/qmxj-blog/p/6978270.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!