事件的委托
代碼：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>事件委托</title>
<style type="text/css">
.list{
list-style: none;
}
.list li{
height: 30px;
background-color: green;
margin-bottom: 10px;
color: #fff;
}
</style>
<script type="text/javascript" src="js/jquery-1.12.4.min.js"></script>
<script type="text/javascript">
$(function(){
/*
給每個(gè)li綁定事件，一共綁定了8次，性能不高
$('.list li').click(function() {
alert($(this).html());
});
*/
/*
事件委托：方法delegate，只綁定一次事件，冒泡觸發(fā)
參數(shù)：
selector選擇器：寫(xiě)入ul下面的所有要發(fā)生事件的元素，多個(gè)元素用空格隔開(kāi)，例如‘li a span’
eventType事件
function要執(zhí)行的操作
$('.list').delegate('li', 'click', function() {
//$(this)指發(fā)生事件的子集，即每個(gè)li
alert($(this).html());
//取消委托
$('.list').undelegate();
});
})
</script>
</head>
<body>
<ul class="list">
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
<li>6</li>
<li>7</li>
<li>8</li>
</ul>
</body>
</html>
節(jié)點(diǎn)的操作
代碼：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>節(jié)點(diǎn)操作</title>
<style type="text/css">
</style>
<script type="text/javascript" src="js/jquery-1.12.4.min.js"></script>
<script type="text/javascript">
$(function(){
var $span = $('<span>span元素</span>');
var $p = $('<p>p段落元素</p>');
var $h = $('<h1>頁(yè)面標(biāo)題</h1>');
/*插入子元素*/
//div中插入span和p（末尾追加）
// $('#div1').append($span);
// $('#div1').append($p);
// 把span和p插入div中
$span.appendTo('#div1');
$p.appendTo('#div1');
//把子元素插入到父元素（前面追加）
// prepend()
// prependTo()
//在div前邊插入兄弟h1標(biāo)題
// $('#div1').before($h);
$h.insertBefore('#div1');
//在后邊插入兄弟元素
//after()
//insertAfter()
//刪除p標(biāo)簽
$p.remove();
})
</script>
</head>
<body>
<div id="div1"></div>
</body>
</html>
ajax
代碼：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>ajax</title>
<style type="text/css">
</style>
<script type="text/javascript" src="js/jquery-1.12.4.min.js"></script>
<script type="text/javascript">
$.ajax({
url: 'data.json',//請(qǐng)求的服務(wù)器路徑，實(shí)際開(kāi)發(fā)中寫(xiě)文檔接口的路徑
type: 'get',//分get/post請(qǐng)求
dataType: 'json',//要讀取什么格式的數(shù)據(jù)，xml script html upload
// data:{page:1}//請(qǐng)求時(shí)要攜帶的參數(shù)
})
.done(function(data){//成功的時(shí)候會(huì)執(zhí)行的函數(shù)
alert(data.name);
console.log(data);
})
.fail(function(){//失敗的時(shí)候
console.log("error");
})
/*.always(function(){//不論成功與否都會(huì)執(zhí)行
console.log("always");
})*/;
</script>
</head>
<body>
</body>
</html>
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成，瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點(diǎn)，簡(jiǎn)書(shū)系信息發(fā)布平臺(tái)，僅提供信息存儲(chǔ)服務(wù)。
