jQuery.extend() - Utilities , jQuery |
jQuery.extend() เป็นการใช้ jQuery Utilities กับ jQuery.extend() รวมเนื้อหาของสองวัตถุหรือมากกว่าวัตถุเข้าด้วยกันในวัตถุแรก
Syntax
1.jQuery.extend( target, [object1,] [objectN] )
2.jQuery.extend( [deep,] target, object1, [objectN] )
Example 1 ตัวอย่างการใช้งาน jQuery jextend()
jQueryextend1.html
01.<html>
02.<head>
03.<title>ThaiCreate.Com jQuery Tutorials</title>
04.<script type="text/javascript" src="jquery-1.6.4.js"></script>
05.<script type="text/javascript">
06. $(document).ready(function(){
07.
08. var object1 = {
09. apple: 0,
10. banana: {weight: 52, price: 100},
11. cherry: 97
12. };
13. var object2 = {
14. banana: {price: 200},
15. durian: 100
16. };
17.
18.
19. $.extend(object1, object2);
20.
21. var printObj = function(obj) {
22. var arr = [];
23. $.each(obj, function(key, val) {
24. var next = key + ": ";
25. next += $.isPlainObject(val) ? printObj(val) : val;
26. arr.push( next );
27. });
28. return "{ " + arr.join(", ") + " }";
29. };
30.
31. $("#log").append( printObj(object1) );
32.
33. });
34.</script>
35.</head>
36.<body>
37.
38. <div id="log"></div>
39.
40.</body>
41.</html>
Screenshot
คำอธิบาย (ภาษาไทย)
จากตัวอย่างเป็นการใช้ jQuery Utilities กับ jQuery.extend() ในการจัดการกับ element ที่อ้างถึง
Example 2 ตัวอย่างการใช้งาน jQuery jextend()
jQueryextend2.html
01.<html>
02.<head>
03.<title>ThaiCreate.Com jQuery Tutorials</title>
04.<script type="text/javascript" src="jquery-1.6.4.js"></script>
05.<script type="text/javascript">
06. $(document).ready(function(){
07.
08. var object1 = {
09. apple: 0,
10. banana: {weight: 52, price: 100},
11. cherry: 97
12. };
13. var object2 = {
14. banana: {price: 200},
15. durian: 100
16. };
17.
18.
19. $.extend(true, object1, object2);
20.
21. var printObj = function(obj) {
22. var arr = [];
23. $.each(obj, function(key, val) {
24. var next = key + ": ";
25. next += $.isPlainObject(val) ? printObj(val) : val;
26. arr.push( next );
27. });
28. return "{ " + arr.join(", ") + " }";
29. };
30.
31. $("#log").append( printObj(object1) );
32.
33. });
34.</script>
35.</head>
36.<body>
37.
38. <div id="log"></div>
39.
40.</body>
41.</html>
Screenshot
คำอธิบาย (ภาษาไทย)
จากตัวอย่างเป็นการใช้ jQuery Utilities กับ jQuery.extend() ในการจัดการกับ element ที่อ้างถึง
Example 3 ตัวอย่างการใช้งาน jQuery jextend()
jQueryextend3.html
01.<html>
02.<head>
03.<title>ThaiCreate.Com jQuery Tutorials</title>
04.<script type="text/javascript" src="jquery-1.6.4.js"></script>
05.<script type="text/javascript">
06. $(document).ready(function(){
07.
08. var defaults = { validate: false, limit: 5, name: "foo" };
09. var options = { validate: true, name: "bar" };
10.
11.
12. var settings = $.extend({}, defaults, options);
13.
14. var printObj = function(obj) {
15. var arr = [];
16. $.each(obj, function(key, val) {
17. var next = key + ": ";
18. next += $.isPlainObject(val) ? printObj(val) : val;
19. arr.push( next );
20. });
21. return "{ " + arr.join(", ") + " }";
22. };
23.
24.
25. $("#log").append( "<div><b>settings -- </b>" + printObj(settings) + "</div>" );
26. $("#log").append( "<div><b>options -- </b>" + printObj(options) + "</div>" );
27.
28. });
29.</script>
30.</head>
31.<body>
32.
33. <div id="log"></div>
34.
35.</body>
36.</html>
Screenshot
คำอธิบาย (ภาษาไทย)
จากตัวอย่างเป็นการใช้ jQuery Utilities กับ jQuery.extend() ในการจัดการกับ element ที่อ้างถึง
ลิ้งค์ที่ควรศึกษา
Go to : jQuery Selectors : jQuery Selectors and Element
เกี่ยวกับบทความ
ส่วนหนึ่งของบทความได้เรียบเรียงและแปลจากเว็บไซต์ jQuery.Com โค้ดตัวอย่างคำสั่งนี้อยู่ภายใต้สัญญาอนุญาตของ GFDL สามารถนำโค้ดและคำสั่งใช้งานได้ฟรี สงวนลิขสิทธิ์เฉพาะคำอธิบายภาษาไทย
|
 ช่วยกันสนับสนุนรักษาเว็บไซต์ความรู้แห่งนี้ไว้ด้วยการสนับสนุน Source Code 2.0 ของทีมงานไทยครีเอท
|
|
| |
By : |
ThaiCreate.Com Team (บทความเป็นลิขสิทธิ์ของเว็บไทยครีเอทห้ามนำเผยแพร่ ณ เว็บไซต์อื่น ๆ) |
| |
Score Rating : |
 |
|
| |
Create/Update Date : |
2011-09-22 21:57:45 /
2017-03-19 14:13:04 |
| |
Download : |
No files |
|
|
Sponsored Links / Related |
|
|
|
|
|
|
|
