JQuery03代码笔记
一、元素的创建
//按钮单击往DIV标记添加一个Span标记
$("#btn").click(function () {
$("<span>你好</span>").appendTo("#div1");
});
//按钮单击往DIV标记添加一个Span标记 方案二
$("#btn").click(function () {
$("#div1").html($("#div1").html() + "<span>你好</span>");
});
二、元素的添加
//把创建的span标签这个子元素直接插入到div中第一个子元素的前面
$("#dv").prepend($("<span>this is span</span>"));
//把元素添加到div的前面的位置,是div的上一个兄弟元素了
$("#dv").before($("<span>this is span2</span>"));
//在DV的最后一个子元素后面添加一个元素
var table=$("<table style='cursor: pointer' border='1' cellspacing='0' cellpadding='0'></table>");
$("#dv").append(table);
三、移除的元素
//移除#DV下的所有元素
$("#dv").empty();
//移除#DV整个元素,包括#dv
$("#dv").remove();
四、设置元素的宽和高
$("#dv").width(500);
$("#dv").height(500);
五、获取元素的left和Top
$("#dv").offset().top
$("#dv").offset().left
六、获取scroll出去的值
$("#dv").scrollLeft();
$("#dv").scrollTop();
$("#dv").scroll(function () {
console.log($("#dv").scrollLeft());
console.log($("#dv").scrollTop());
})
七、元素事件绑定
//对象.事件名字(事件处理函数);---
$("#btn").click(function(){});
//对象.bind("事件名字",事件处理函数);---
$("#btn").bind("click",function(){});
//父级对象.delegate("子级元素","事件名字",事件处理函数);---->
$("#dv").delegate("p","click",function(){});
八、获取文本域中的文本
//获取文本域中的value值
$("#tt2").val();
$("#tt2").text();
九、元素的选中
//元素的选中不建议使用arrt属性,建议使用prop。prop也是获取元素的属性和值的方法。
$("#ck7").prop("checked", true);