jQuery學(xué)習(xí)
來(lái)源：程序員人生 發(fā)布時(shí)間：2015-01-07 08:57:58 閱讀次數(shù)：3143次
控制頁(yè)面
控制元素內(nèi)容和值
操作元素內(nèi)容
操作文本內(nèi)容
text（) 獲得全部匹配元素的文本內(nèi)容
text(val) 設(shè)置全部匹配元素的文本內(nèi)容
<div>
<span>test</span>
</div>
....
$("div").text();//獲得div元素的文本內(nèi)容
操作HTML內(nèi)容
html（）獲得第1個(gè)匹配元素的HTML內(nèi)容
html（val）設(shè)置全部匹配元素而的HTML內(nèi)容
<div><span>test</span></div>
...
$("div").html();
操作元素的值
var（）獲得第1個(gè)匹配元素確當(dāng)前值，返回字符串或數(shù)組
$("#le").val();//獲得id為le的元素的值
var（val）設(shè)置所有匹配元素的值
$("input:text").val("new");//為全部文本框設(shè)置值
var（[ ]）為radio等元素設(shè)置值
$("select").val(['列表項(xiàng)1','列表項(xiàng)2'，'列表項(xiàng)3']);
操作DOM節(jié)點(diǎn)
查找節(jié)點(diǎn)
創(chuàng)建節(jié)點(diǎn)
<script language="javascript">
$(document).ready(function()
{
var $p=$("<p></p>");//創(chuàng)建1個(gè)節(jié)點(diǎn)
$p.html("<span style='color:#FF0000'>添加</span>");//重新設(shè)置<div>的HTML內(nèi)容
$("body").append($p);//在body中創(chuàng)建了1個(gè)新的段落節(jié)點(diǎn)
});
插入節(jié)點(diǎn)
內(nèi)部插入節(jié)點(diǎn)
外部插入節(jié)點(diǎn)
刪除、復(fù)制、替換節(jié)點(diǎn)
刪除節(jié)點(diǎn)
empty（）
remove（）
2者區(qū)分
$(document).ready(function(){
$("#div1").empty();//刪除div1的所有子節(jié)點(diǎn)
$("#div2").remove();//刪除id為div2的節(jié)點(diǎn)
});
復(fù)制節(jié)點(diǎn)
clone（）
$(function(){
$("input").bind("click",function(){//為按鈕綁訂單擊事件
$(this).clone(true).insertAfter(this);//復(fù)制自己和事件處理
});
});
替換節(jié)點(diǎn)
replaceAll（）
repalceWith（content）
<script language="javascript">
$(document).ready(function(){
$("#div1").replacewith("<div>replacewith()的替換結(jié)果</div>");
$("<div>replaceAll()的替換結(jié)果</div>").replaceAll("#div2");
});
</script>
操作CSS樣式
修改CSS類實(shí)現(xiàn)
eg
$("div").addClass("yellow red");//為所有div元素添加yellow和red倆個(gè)CSS類
修改CSS樣式實(shí)現(xiàn)
生活不易，碼農(nóng)辛苦
如果您覺(jué)得本網(wǎng)站對(duì)您的學(xué)習(xí)有所幫助,可以手機(jī)掃描二維碼進(jìn)行捐贈(zèng)
