Rumah > hujung hadapan web > tutorial js > Pengenalan kepada beberapa kaedah teras dalam jQuery programming_jquery

Pengenalan kepada beberapa kaedah teras dalam jQuery programming_jquery

WBOY
Lepaskan: 2016-05-16 15:45:06
asal
1740 orang telah melayarinya

Kaedah memanggil objek jQuery adalah sangat mudah:

$('h1').remove();

Salin selepas log masuk

Kebanyakan kaedah jQuery dipanggil seperti di atas. Kaedah ini terletak di ruang nama $.fn. Kaedah ini dipanggil kaedah objek jQuery.

Tetapi terdapat juga beberapa kaedah yang tidak bergantung pada set hasil pemilih Kaedah ini terletak dalam ruang nama jQuery. Jika anda merasa sukar untuk memahami, cuma ingat dua perkara berikut:

  1. Semua kaedah pemilih jQuery terletak dalam ruang nama $.fn.
  2. Kaedah dalam $ biasanya beberapa kaedah berfungsi praktikal Kaedah ini tidak bergantung pada pemilih, dan parameter dan nilai pulangan kaedah ini juga sangat berbeza.

Sesetengah kaedah objek akan mempunyai nama yang sama seperti kaedah teras, seperti $.fn.each dan $.each, jadi anda perlu memberi perhatian khusus apabila menggunakannya.

ruang nama $ jQuery menyediakan banyak kaedah berguna:

Alih keluar ruang putih daripada rentetan dua kali:

$.trim('  lots of extra whitespace  ');
// 返回 'lots of extra whitespace'

Salin selepas log masuk

Lelaran pada tatasusunan dan objek:

$.each([ 'foo', 'bar', 'baz' ], function(idx, val) {
  console.log('element ' + idx + 'is ' + val);
});

$.each({ foo : 'bar', baz : 'bim' }, function(k, v) {
  console.log(k + ' : ' + v);
});

Salin selepas log masuk

Mengembalikan indeks elemen dalam tatasusunan, atau -1 jika elemen itu tidak wujud

var myArray = [ 1, 2, 3, 5 ];

if ($.inArray(4, myArray) !== -1) {
  console.log('找到了');
}

Salin selepas log masuk

Gunakan satu objek untuk memanjangkan objek lain:

var firstObject = { foo : 'bar', a : 'b' };
var secondObject = { foo : 'baz' };

var newObject = $.extend(firstObject, secondObject);
console.log(firstObject.foo); // 'baz'
console.log(newObject.foo);  // 'baz'

Salin selepas log masuk

Jika anda tidak mahu menukar nilai dalam objek pertama, hanya hantar objek kosong dalam parameter pertama $.extend:

var firstObject = { foo : 'bar', a : 'b' };
var secondObject = { foo : 'baz' };

var newObject = $.extend({}, firstObject, secondObject);
console.log(firstObject.foo); // 'bar'
console.log(newObject.foo);  // 'baz'

Salin selepas log masuk

Tukar skop fungsi:

var myFunction = function() { console.log(this); };
var myObject = { foo : 'bar' };

myFunction(); // logs window object

var myProxyFunction = $.proxy(myFunction, myObject);
myProxyFunction(); // logs myObject object

Salin selepas log masuk

Digabungkan dengan acara untuk melihat cara menukar skop fungsi:

var myObject = {
  myFn : function() {
    console.log(this);
  }
};

$('#foo').click(myObject.myFn); // logs DOM element #foo
$('#foo').click($.proxy(myObject, 'myFn')); // logs myObject

Salin selepas log masuk

JavaScript sendiri mempunyai kaedah pengesanan jenis, jQuery juga mempunyainya, dan ia melakukannya dengan lebih baik:

var myValue = [1, 2, 3];

// 用 JavaScript 的 typeof 操作符来判断类型
typeof myValue == 'string'; // false
typeof myValue == 'number'; // false
typeof myValue == 'undefined'; // false
typeof myValue == 'boolean'; // false

// 用恒等于 检测 null
myValue === null; // false

// 使用 jQuery 的方法来判断类型
jQuery.isFunction(myValue); // false
jQuery.isPlainObject(myValue); // false
jQuery.isArray(myValue); // true

Salin selepas log masuk

Tambah data tambahan pada elemen HTML:

$('#myDiv').data('keyName', { foo : 'bar' });
$('#myDiv').data('keyName'); // { foo : 'bar' }

Salin selepas log masuk

Data yang akan ditambahkan boleh terdiri daripada sebarang jenis:

$('#myList li').each(function() {
  var $li = $(this), $div = $li.find('div.content');
  $li.data('contentDiv', $div);
});

// 不需要再去找那些 div 了;
// 可以直接从 list 中读取出来
var $firstLi = $('#myList li:first');
$firstLi.data('contentDiv').html('new content');

Salin selepas log masuk


Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan