基础课程2下午603代码和04javascript第四章_第1页
基础课程2下午603代码和04javascript第四章_第2页
基础课程2下午603代码和04javascript第四章_第3页
基础课程2下午603代码和04javascript第四章_第4页
基础课程2下午603代码和04javascript第四章_第5页
已阅读5页，还剩11页未读， 继续免费阅读

下载本文档

版权说明：本文档由用户提供并上传，收益归属内容提供方，若内容存在侵权，请进行举报或认领

文档简介

第四章DOM对象讲师:孙书华QQ:2226230644什么是DOMDOM的结构模型DOM常用属性DOM常用方法DOM什么是domDocumentObjectModel（文档对象模型）为HTML、XML文件的操作提供了API。它提供了文件的结构表述。是建立网页与Script程序语言沟通的桥梁。DOMDOM节点与层次htmlheadbodymodeltitleullililinoodlesugarfish例:<html> <head> <title>model</title> </head><body> <ulid=“alist”> <li>noodle</li> <li>fish</li> <li>sugar</li> </ul></body></html>”家谱树“模型非常适合用来表示一份用XHTML或XML语言编写出来的文档Html元素有两个子元素：<head>和<body>（它们是兄弟关系）Head元素有1个子元素:<title>title元素有一个子元素：modelBody元素有1个子元素：<ul><ul>有3个子元素都是<li>每个li又分别有1个子元素：noodle、fish、sugar。DOM的结构模型分析XHTML文档中的每个成分都是一个节点。DOM是这样规定的：整个文档是一个文档节点每个XHTML标签是一个元素节点包含在XHTML元素中的文本是文本节点每一个XHTML属性是一个属性节点注释属于注释节点DOM节点引入<body>、<ul>、<li>等元素称为元素节点元素节点可以包含其他节点获取元素节点可以用以下方法:document.getElementById(“idname”)document.getElementsByTagName(“tagname”)document.getElementsByName(“name”)

getElementsByName(‘name’),保证兼容性,只用于表单元素节点例子中<title>元素中包含着文本“model”，model就是一个文本节点。在XHTML文档中，文本节点总是被包含在元素节点的内部。文本节点有些元素节点会有一些属性，用以对元素做更具体的描述。<ulid=“alist”>中的id=“alist”就是一个属性节点。获取属性值可以有两种方法：element.getAttribute(“属性名”);Element.属性名;[推荐]更改属性值可以有两种方法：element.setAttribute(“属性名”，属性值);Element.属性名=属性值;[推荐]属性节点获得属性设置属性创建节点添加节点DOM常用方法设置样式属性值或class属性值应该像下边这样属性设置样式属性Element.style.background=“red”;Element.className=“className”;元素样式元素属性createElement(标签名)

创建一个指定名称的元素。范例：varn=document.createElement("div")createTextNode(字符串)

建立一个新的text节点范例：varn=

document.createTextNode(“23.9”);创建节点appendChild(oNode)追加一个子节点（作为最后的子节点）范例：parentNode.appendChild(newnode)添加节点innerHTML给节点添加html代码该方法不是w3c的标准，但是主流浏览器支持parentNode.innerHTML(“<p>要显示内容</p>”);获取/设置节点的html内容使用js操作css属性的写法是有一定的规律的：1、对于没有中划线的css属性一般直接使用style.属性名即可。

如：obj.style.margin，obj.style.width，obj.style.left，obj.style.position等。2、对于含有中划线的css属性，将每个中划线去掉并将每个中划线后的第一个字符换成大写即可。

如：ob

人人文库> 全部分类> 教育资料 > 课件下载

温馨提示

  • 1. 本站所有资源如无特殊说明，都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等，如果需要附件，请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸，网页内容里面会有图纸预览，若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间，仅对用户上传内容的表现方式做保护处理，对用户上传分享的文档内容本身不做任何修改或编辑，并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容，请与我们联系，我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

最新文档

评论

0/150

提交评论