<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript" src="jquery.1.11.1.min.js"></script>
<style type="text/css">
.red{
color: red;
}
.box3{
width: 100px;
height: 100px;
background: red;
}
</style>
</head>
<body>
addClass() 添加類名
removeClass() 移除類名
toggleClass() 添加或移除類名,這個方法很靈活,很舒服
html() 無參數時獲取內部html或者有參數設置內部html
text() 無參數時獲取內部文本或者有參數設置內部文本
val() 獲取或者設置表單元素的value
css() 獲取或者設置css樣式
一個字符串參數 獲取
一個對象 設置
兩個參數 設置
attr() 給普通標簽設置或者獲取屬性
removeAttr() 移除屬性
prop() 給表單元素設置和獲取屬性
data() 給JQ對象設置屬性
offset 偏移值
<div id="box">box</div>
<div id="box1">
<span>span1</span><span>span2</span>
</div>
<div id="box2">111</div>
<div id="box100"></div>
<input type="text" name="" id="t">
<div class="box3"></div>
<script type="text/javascript">
//開始這樣<div id="box100"></div>,
//添加屬性后變成<div id="box100" name="zhangsan"></div>
$("#box100").attr("name","zhangsan");
$("[name=zhangsan]").html("123") //因為有屬性了,所有可以賦值
$("#box").addClass("red").click(function(){
// $(this).removeClass("red");
//this指id名為box對應的標簽, toggleClass()這個方法有類就刪除類,沒類就添加類,很靈活,很舒服
$(this).toggleClass("red");
});
$("#box1").html("<span>hello</span>"); //設了參數就替換了原來的值
$("#box2").text("<span>hello</span>"); //設了參數就替換了原來的值,標簽名也會寫上去
$("#t").val("happy"); //給表單賦值的
$("#t").change(function(){ //輸入框內容發生改變時,鼠標一移開馬上觸發
alert(123)
})
$(".box3").css("background","#FFFF00"); //2個值設置寬度
$("#box").attr("index",0); //添加屬性,2個參數添加屬性,一個參數獲得屬性
$("#box").removeAttr("index"); //移除屬性
</script>
</body>
</html>