jQuery学习笔记[1] jQuery中的DOM操作
jQuery学习笔记[1] jQuery中的DOM操作
发布时间:2016-12-30 来源:查字典编辑
摘要:DOM分为3个方面,即DOMCore,HTML-DOM,CSS-DOM.1,DOMCore并不专属于JavaScript,任何一种支持DOM...

DOM分为3个方面,即DOM Core,HTML-DOM,CSS-DOM.

1,DOM Core并不专属于JavaScript,任何一种支持DOM的程序设计语言都可以使用它.

JavaScript中的getElementById(),getElementsByTagName()...等方法.

例如:使用DOM Core来获取表单对象的方法:

document.getElementsByTagName("form");

2,HTML-DOM.

在使用JavaScript和DOM为HTML文件编写脚本的时候.有许多专属于HTML-DOM的属性.HTML-DOM的出现甚至比DOM Core还要早,它提供了一些更简明的记号来描述各种HTML元素的属性.

例如:使用HTML-DOM来获取表单对象的方法:

document.forms //HTML-DOM提供了一个forms对象.

3,CSS-DOM

CSS-DOM是针对CSS的操作.在JavaScript中CSS-DOM技术的主要作用是获取和设置style对象的各种属性.

例如:设置某元素style对象字体颜色的方法:element.style.color="red";

下面学习的是:jQuery中的DOM操作:

先构建出一棵DOM树:

复制代码 代码如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

<title>jQuery中的DOM操作</title>

</head>

<body>

<p title="选择你最喜欢的水果">你最喜欢的水果是?</p>

<ul>

<li title="苹果">苹果</li>

<li title="橘子">橘子</li>

<li title="菠萝">菠萝</li>

</ul>

</body>

</html>

接下来的操作都是围绕这个DOM树而展开的.

推荐文章
猜你喜欢
附近的人在看
推荐阅读
拓展阅读
相关阅读
网友关注
最新Javascript教程学习
热门Javascript教程学习
编程开发子分类