(一)JQuery中的事件
1.常规事件,把js事件中的on去掉
复合事件:hover(function(){},function(){}) ---- 相当于把鼠标移入移出事件和在一起执行
toggle(function(){},function(){},....)可以写多个,点击事件循环执行
未来元素:对象.live("事件名",function(){}); --- 对未来创建的元素进行操作
列子:点击按钮,创建元素,并给创建的元素添加点击事件
//对象.append();在什么对象下添加元素 $("html中要创建的内容")
$("#boss").append($("<div class='div1'></div>"));
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<script src="Js/jquery-1.7.1.min.js"></script>
<title></title>
<style type="text/css">
.div1 {
100px;
height:100px;
margin-left:20px;
margin-top:20px;
float:left;
background-color:red;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<input type="button" value="提交" id="but"/>
<div style="800px;height:600px;" id="boss">
<div class="div1">
</div>
<div class="div1">
</div>
<div class="div1">
</div>
</div>
</form>
</body>
</html>
<script type="text/javascript">
//对象.live未来事件
$(".div1").live("click",function () {
alert("aaa");
});
$("#but").click(function () {
//对象.append();在什么对象下添加元素 $("html中要创建的内容")
$("#boss").append($("<div class='div1'></div>"));
});
</script>
2.阻止事件冒泡的方法:直接在事件中加入 return false;
(二)Dom操作
1.操作属性:
获取属性:var s = $("选择器").attr("属性名")
设置属性:$("选择器").attr("属性名","属性值")
删除属性:$("选择器").removeAttr("属性名")
2.操作样式:
操作样式:获取样式: var s = $("选择器").css("样式名")
设置样式:$("选择器").css("样式名","值")
操作样式表的class:添加class $("选择器").addClass("class名")
移出class $("选择器").removeClass("class名")
添加移除交替class $("选择器").toggleClass("class名")
3.操作内容:
表单元素的取值赋值和js中的一样,非表单元素中,.html赋值:标记会编译,取值:标记会取出
.text赋值:内容直接全部输入,取值:只取出文字内容
表单元素:
取值:var s = $("选择器").val()
赋值: $("选择器").val("值")
非表单元素:
取值:var s = $("选择器").html(), var s = $("选择器").text()
赋值:$("选择器").html("内容"), $("选择器").text("内容")
4.操作相关元素:
查找:父辈 --- parent() 前辈 --- parents(选择器)
子级 --- children(选择器) 后代 --- find(选择器)
兄弟(哥哥) --- prev() ,prevAll(选择器) 弟弟 --- next()后面一个元素 nextAll(选择器)后面兄弟级的元素
操作:新建元素$("html字符串")
添加:对象.appen(jquery对象) --- 内部添加,给什么对象添加
after(jquery对象) --- 下部平级添加
before(jquery对象) --- 上部平级添加
移出:empty() --- 清空内部全部元素
remove() --- 移出元素
复制:clone()
