收藏
天蓬老師批改狀態(tài)：合格
老師批語(yǔ)：很多地方代碼不應(yīng)該省呀,現(xiàn)在你在學(xué)習(xí)階段,這樣做不好
1、DOM操作插入：
（1）函數(shù)方法
| 方法 | 作用說(shuō)明 |
|---|---|
.append .appendTo |
當(dāng)前元素有子元素則在子元素末尾插入，無(wú)子元素則在當(dāng)前元素后面插入 ；兩個(gè)方法作用相同，只是使用方法不同 |
.prepend() .prepednTo() |
在元素內(nèi)部頭部插入，兩個(gè)方法作用相同,用辦法不同 |
.after() .insertAfter() |
在元素之后插入,兩個(gè)方法作用相同，只是使用方法不同 |
.before() .insertBefore() |
在元素之前插入，兩個(gè)方法作用相同，只是使用方法不同 |
2.元素的刪除操作
| 方法 | 作用說(shuō)明 |
|---|---|
.remove() |
移除元素本身 |
.empty() |
移除元素本身的內(nèi)容（包含里面的html內(nèi)容） |
3.替換元素
| 方法 | 作用說(shuō)明 |
|---|---|
new.replaceAll(old) |
替換元素內(nèi)所有匹配的 |
old.replaceWith(new) |
用提供的內(nèi)容替換集合中所有匹配的元素并且返回被刪除元素的集合。 |
4.實(shí)操演練
（1）代碼部分
<!DOCTYPE html><html><head><meta charset="utf-8"><title>Jquery操作和請(qǐng)求</title><script src="jquery.js"></script><style>ul:first-of-type{background-color: lightblue;}</style></head><body><ul><li>item1</li><li class="shuang">item2</li><li>item3</li><li class="shuang">item4</li><li class="dan">item5</li></ul><ul><li>item1</li><li>item2</li><li>item3</li></ul></body><script>let cl=console.log;cl($);// appendTo和append作用相同：在元素內(nèi)部末尾(或者元素后面)插入，用法不同而已$("ul:first-child").append("<li>item6</li>");$("<li>item7</li>").appendTo($("ul:first-child"));$("ul:first-child > li:nth-child(3)").append("<li>item</li>");//在元素內(nèi)部頭部插入，兩個(gè)方法作用相同知識(shí)用辦法不同，$("ul:first-child").prepend("<li>item0</li>");$("<li>item-1</li>").prependTo($("ul:first-child"));// after()和before()$("ul:first-child").after("<h2>結(jié)束</h2>");$("ul:first-child").before("<h1>開(kāi)始</h1>");// cl($("ul:last-of-type"));$("<h2>second<h2>").insertAfter($("ul:last-of-type"));$("<h2>one<h2>").insertBefore($("ul:last-of-type"));cl($("ul:last-of-type").text());cl($("ul:last-of-type > li:last-of-type").text());// cl($("ul:nth-child(1)"));// .remove();$("li:last-of-type").remove();$("ul:last-of-type > li:nth-of-type(1)").empty();$("ul:last-of-type").empty();$("ul:last-of-type").remove();cl($(".shuang"));// 兩個(gè)函數(shù)作用相同知識(shí)用法不同$("<li>$$$$$$$$</li>").replaceAll($(".shuang"))$(".dan").replaceWith($("<li>22222</li>"));</script></html>
1.GET和POST請(qǐng)求：
2.ajax請(qǐng)求
$.ajax({type:"GET",url:"url",data:{id:2,},dataType:"json|html",//告訴跨域訪問(wèn)的服務(wù)器需要返回的函數(shù)名稱(chēng)//dataType:"jsonp",//jsonpCallback: "show",success:function(){……}})
微信掃碼
關(guān)注PHP中文網(wǎng)服務(wù)號(hào)
技術(shù)交流群
QQ掃碼
加入技術(shù)交流群
Copyright 2014-2025 http://ipnx.cn/ All Rights Reserved | php.cn | 湘ICP備2023035733號(hào)