- 1、本文档共8页,可阅读全部内容。
- 2、原创力文档(book118)网站文档一经付费(服务费),不意味着购买了该文档的版权,仅供个人/单位学习、研究之用,不得用于商业用途,未经授权,严禁复制、发行、汇编、翻译或者网络传播等,侵权必究。
- 3、本站所有内容均由合作方或网友上传,本站不对文档的完整性、权威性及其观点立场正确性做任何保证或承诺!文档内容仅供研究参考,付费前请自行鉴别。如您付费,意味着您自己接受本站规则且自行承担风险,本站不退款、不进行额外附加服务;查看《如何避免下载的几个坑》。如果您已付费下载过本站文档,您可以点击 这里二次下载。
- 4、如文档侵犯商业秘密、侵犯著作权、侵犯人身权等,请点击“版权申诉”(推荐),也可以打举报电话:400-050-0827(电话支持时间:9:00-18:30)。
查看更多
第5章 基础DOM和CSS操作
第5章基础DOM和CSS操作
学习要点:
1.DOM简介
2.设置元素及内容
3.元素属性操作
4.元素样式操作
5.CSS方法
DOM在JavaScript课程中我们详细的探讨过,它是一种文档对象模型。方便开发者对
HTML结构元素内容进行展示和修改。在JavaScript 中,DOM不但内容庞大繁杂,而且
们开发的过程中需要考虑更多的兼容性、扩展性。在jQuery 中,已经将最常用的DOM操
作方法进行了有效封装,并且不需要考虑浏览器的兼容性。
一.DOM简介
由于课程是基于JavaScript基础上完成的,这里我们不去详细的了解DOM到底是什么。
只需要知道几个基本概念:
1.D表示的是页面文档Document、O表示对象,即一组含有独立特性的数据集合、M
表示模型,即页面上的元素节点和文本节点。
2.DOM有三种形式,标准DOM、HTMLDOM、CSSDOM,大部分都进行了一系列的
封装,在jQuery 中并不需要深刻理解它。
3.树形结构用来表示DOM,就非常的贴切,大部分操作都是元素节点操作,还有少部
分是文本节点操作。
二.设置元素及内容
我们通过前面所学习的各种选择器、过滤器来得到我们想要操作的元素。这个时候,
们就可以对这些元素进行 DOM 的操作。那么,最常用的操作就是对元素内容的获
取和修改。
html()和text()方法
方法名 描述
html() 获取元素中HTML 内容
html(vaue) 设置元素中HTML 内容
text() 获取元素中文本内容
text(vaue) 设置原生中文本内容
val() 获取表单中的文本内容
val(vaue) 设置表单中的文本内容
在常规的DOM元素中, 们可以使用html()和text()方法获取内部的数据。html()方法
可以获取或设置htm 内容,text()可以获取或设置文本内容。
$(#box).htm(); //获取htm 内容
$(#box).text(); //获取文本内容,会自动清理htm 标签
$(#box).htm(emwww.li.cc/em); //设置htm 内容
$(#box).text(emwww.li.cc/em); //设置文本内容,会自动转义htm 标签
注意:当 们使用html()或text()设置元素里的内容时,会清空原来的数据。而 们期
望能够追加数据的话,需要先获取原本的数据。
$(#box).htm($(#box).htm()+emwww.li.cc/em); //追加数据
如果元素是表单的话,jQuery提供了val()方法进行获取或设置内部的文本数据。
$(input).val(); //获取表单内容
$(input).val(www.li.cc); //设置表单内容
如果想设置多个选项的选定状态,比如下拉列表、单选复选框等等,可以通过数组传递
操作。
$(input).val([check1,check2,radio1]); //vaue值是这些的将被选定
三.元素属性操作
除了对元素内容进行设置和获取,通过jQuery也可以对元素本身的属性进行操作,包
括获取属性的属性值、设置属性的属性值,并且可以删除掉属性。
attr()和removeAttr()
方法名
您可能关注的文档
- 采访心理学在新闻实践中的运用.pdf
- 操作系统复习题(参考版).pdf
- 彩超操作基础知识.pdf
- 常减压蒸馏装置设备腐蚀典型事例与防护.pdf
- 常压催化联合装置的腐蚀与防护技术新进展.pdf
- 常用磁粉探伤仪规格型号大全.pdf
- 常用贴片三极管主要参数及丝印.pdf
- 常用空调节能方式与控制.pdf
- 常用铸铁牌号.pdf
- 常用旋转编码器型号规格.pdf
- 2022-2023年中级银行从业资格之中级银行业法律法规与综合能力模拟卷和答案.docx
- 2022-2023年中级银行从业资格之中级银行业法律法规与综合能力模拟卷包括详细解答.docx
- 2022-2023年中级银行从业资格之中级银行业法律法规与综合能力模拟卷含答案讲解.docx
- 《飞驰在高速公路上》教案.doc
- 2022-2023年中级银行从业资格之中级银行业法律法规与综合能力检测卷.docx
- 2022-2023年中级银行从业资格之中级银行业法律法规与综合能力检测卷附答案详解.docx
- 教案《小蜗牛慢慢爬》.doc
- 《倍数和因数》公开课教案和教学研讨.doc
- 2023年中级银行从业资格之中级银行业法律法规与综合能力综合提升练习题包括详细解答.docx
- 2023年中级银行从业资格之中级银行业法律法规与综合能力综合提升练习题含答案讲解.docx
文档评论(0)