abstrak：<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> </head> <style> .box{color: red;} .box1{font-size: 50px;} </style&g
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<style>
.box{color: red;}
.box1{font-size: 50px;}
</style>
<body>
<p>php中文網(wǎng)</p>
<input type="text" id="input" value="111"/>
<input type="text" id="input1" value="請(qǐng)輸入"/>
<button class="btn">點(diǎn)擊變色</button>
</body>
<script type="text/javascript" src="../js/jquery-1.11.1.min.js" ></script>
<script>
$(document).ready(function(){
//樣式操作
//addClass()被選中的元素添加一個(gè)類（樣式） 多個(gè)類之間用空格分開(kāi) 不用點(diǎn)號(hào)
$("p").addClass("box box1")
//removeClass()移除一個(gè)或多個(gè)類
$("p").removeClass("box")
//attr()設(shè)置或返回被選中元素的屬性值
alert($("#input").attr("type")+$("input").attr("value"))
//$("屬性值"，"屬性名")設(shè)置元素的屬性值
$("#input").attr("type","password")
//removeAttr()移除某個(gè)屬性
$("#input").removeAttr("value")
//hasclass()檢查被選中的元素是否包含指定class 返回值true或者false
alert($("input").hasClass("btn"))
alert($("button").hasClass("btn"))
//toggleClass()對(duì)選中元素進(jìn)行添加和刪除類的切換操作 可切換
$("button").click(function(){
$("p,input").toggleClass("box box1")
})
//內(nèi)容操作
//text()設(shè)置或返回元素的文本內(nèi)容
alert($("p").text())
//設(shè)置元素的文本內(nèi)容
$("p").text("我愛(ài)php中文網(wǎng)")
//html()設(shè)置或返回元素的文本內(nèi)容 與text()不同在于可以輸出帶html標(biāo)簽的文本內(nèi)容
$("p").html("<i>php中文網(wǎng)</i>")
//val()設(shè)置或返回被選中元素的值
alert($("#input1").val())
})
</script>
</html>總結(jié)：使用選擇器找到要操作的元素,然后通過(guò)jquery方法操作此元素,改變?cè)撛氐臉邮揭约皟?nèi)容，其中html()方法可以返回帶標(biāo)簽的文本內(nèi)容，hasClass()方法返回值為true或者false