JQuery实现DOM操作

JQuery实现DOM操作

DOM是W3C的标准
DOM定义访问HTML和XML文档的标准

1.创建及添加元素

1.创建元素

var d = $("<div id='xx'>abc</div>");

2.添加到页面最后

$("body").append(d);

3.添加到页面最前面

$("body").prepend(d);

4.添加到某个元素的前面

$("#abc").before(新元素);

5.添加到某个元素的后面

$("#abc").after(新元素);

6.删除元素对象

$("#abc").remove();

2.修改元素相关

1.修改元素的文本内容.text() 等效于js中的 innerText

元素对象.text("xxx");			元素对象.text() 获取

2.修改元素的html内容.html() 等效于js中的innerHtml

元素对象.html("<h1>xxx</h1>");			元素对象.html() 获取

3.修改元素的css样式.css()

元素对象.css("样式名称"，"样式值")；
元素对象.css({"width":"200px","height":"100px"}); 批量添加css样式
取样式值 元素对象.css("样式名称")

4.修改元素的属性.attr()

元素对象.attr("属性名","属性值")；
获取属性值		元素对象.attr("属性名")；