jQuery元素操作

jquery中创建元素及追加元素

dom中可以动态创建元素:document.createelement(“标签的名字”);

jquery中同样可以创建元素标签,并且返回的就是jquery对象,可以直接调用方法
进行使用

1.append 方法用来在元素的末尾追加元素（最后一个子节点）。增加元素末尾

2.prepend ，在元素的开始添加元素（第一个子节点）。增加元素开始

3.after ，在元素之后添加元素（添加兄弟）增加元素后面

4.before ：在元素之前添加元素（添加兄弟）增加元素前面

案例：

权限选择

创建元素的方式:

1.html方法设置内容,返回的是当前的对象,如果不传入参数,获取的是标签中的内容
2.html 方法可以创建元素

3.$(“html 标签”) 可以创建元素

案例：点击按钮动态创建表格

设置和获取表单的value

input标签:文本框,radio,select,textarea(文本域),checkbox….常见的表单标签都可以通过val方法获取和设置value值

例如：

$("#txt1").val("admin");
$("#txt2").val("123456");
$("#txt3").val(" 这是一个条款");
$("#s1").val(2);// 设置 value 为 2 的选中

案例:设置和获取系统属性值或者自定义属性

$("#btn1").click(function () {
$("a").attr("title"," 传智播客")
$("a").attr("href","http://www.itcast.cn");
});
$("#btn2").click(function () {
// 获取属性值
console.log($("a").attr("title"));
});

attr()方法:可以设置属性值,两个参数:1.属性名字,2,属性值
attr()方法:可以获取属性值,一个参数:1.属性名字

案例:全选和反选案例

设置复选框选中:(attr设置checkbox的选中有问题)prop
prop用法和attr一样

设置和获取元素的宽和高

通过.css()方法写一个属性可以获取宽或者高,是字符串类型如果获取后重新设置需要转换,麻烦

1.width()方法获取宽度

2.height()方法获取高度

获取的时候直接就是数字类型

例如：

console.log($("div").width());
console.log($("div").height());

位置操作

offset()方法返回的是对象,并且,对象中有一个left和一个top,并且值是数字类型，设置的时候也可以没有px，设置的时候元素在设置前如果没有脱离文档流,设置的时候会自动进行脱离文档流,默认为relative，如果设置前有脱离文档流,那么设置的时候直接改变位置

例如：

// 获取的是对象 , 并且没有 px
console.log($("div").offset());
console.log($("div").offset().left);
console.log($("div").offset().top);

注意:如果层和层中的标签同时定位,并且,标签距离左上角50px.通过按钮设置层距离左上角100px,那么标签此时距离左上角为150px。

特此声明：如需转载请注明出处，如有疑问请及时提出以便于改正，如有侵权，联系删除，谢谢