berfungsi sebagai: 1. Sebagai pembungkus jQuery, menggunakan pemilih untuk memilih elemen DOM, sintaks ialah "$("pemilih""; 2. Awalan fungsi, sebagai ruang nama untuk fungsi utiliti umum Awalan, untuk contoh "$.trim(sString);"; 3. Selesaikan konflik dalam fungsi window.onload 4. Buat elemen DOM, contohnya "$("
Ini adalah cerita yang bagus>") " ; 5. Sesuaikan kaedah untuk melanjutkan jQuery 6. Gunakan jQuery dan perpustakaan lain 7. Sediakan pengendali kesediaan dokumen.
Persekitaran pengendalian tutorial ini: sistem windows7, versi jquery3.6, komputer Dell G3.
1. Sebagai pembungkus jQuery, gunakan pemilih untuk memilih elemen DOM
Fungsi pemilih dalam CSS adalah untuk memilih elemen tertentu pada halaman Elemen kategori (pemilih kategori) atau elemen tertentu (pemilih ID)
, dan "$" dalam jQuery sebagai pemilih juga memilih kategori atau elemen tertentu, kecuali jQuery Menyediakan
pilihan yang lebih dan lebih komprehensif. Dan ia mengendalikan isu keserasian penyemak imbas untuk pengguna
h2 a{ /添加CSS属性/ }
$("h2 a")
$(selector)
jQuery(selector)
$("#showp“)
$(".SomeClass")
$("p : odd")
$("td:nth-child(1)")
$("li > a")
Untuk kemudahan menulis kod, "$" biasanya digunakan dan bukannya "jQuery"
2 Awalan fungsi
Dalam JavaScript, pembangun selalunya. perlu membawa beberapa fungsi kecil untuk mengendalikan pelbagai butiran operasi, seperti apabila pengguna menyerahkan Semasa membentuk borang, perlu mengosongkan ruang hadapan dan hujung dalam kotak teks JavaScript tidak menyediakan fungsi yang serupa dengan pemangkasan (), tetapi selepas memperkenalkanjQuery, anda boleh menggunakannya terus trim() fungsi, seperti Kod di atas bersamaan dengan:
Iaitu, fungsi trim() ialah kaedah objek jQuery. 3 Selesaikan konflik fungsi window.onload$.trim(sString);
jQuery.trim(sString);
Masalah konflik adalah sangat sukarKaedah ready() dalam jQuery adalah sangat baik Ia menyelesaikan masalah di atas, ia boleh menjalankan fungsi secara automatik selepas halaman dimuatkan,
dan pelbagai kaedah ready() boleh digunakan dalam halaman yang sama tanpa bercanggah antara satu sama lain. Sebagai contoh,jQuery juga menyediakan singkatan untuk kod di atas, anda boleh meninggalkan bahagian "(document).ready", kodnya adalah seperti berikut:
4. Cipta elemen DOM$(document).ready(function(){ $("table.datalist tr:nth-child(odd)").addClass("altrow"); });
Gunakan kaedah DOM untuk mencipta nod elemen, biasanya anda perlu menggabungkan document.createElement(), document.create TextNode(),
$(function(){ $("table.datalist tr:nth-child(odd)").addClass("altrow"); });
var oNewP = $(" Ini cerita yang bagus>")Kod di atas bersamaan dengan kod berikut dalam javascript:
Selain itu, jQuery juga menyediakan kaedah insertAfter() bagi elemen DOM Kod pseudo adalah seperti berikut:
5. Sesuaikan penambahan "$"var oNewP = document.createElement("p");// 新建节点 var oText = document.createTextNode("这是一个好故事"); oNewP.appendChild(oText);
jQuery tidak dapat memenuhi semua keperluan semua pengguna, dan beberapa keperluan khas adalah sangat khusus dan tidak sesuai untuk dimasukkan dalam keseluruhan rangka kerja jQuery,
用户可以自定义该方法。代码如下:
$.fn.disable = function(){ return this.each(function(){ if(typeof this.disabled != "undefined") this.disabled = true; }); }
以上代码首先设置".fn.disable",表明为""添加一个方法“disable()”,其中“$.fn”是扩展jQuery时所必须的
然后利用匿名函数定义这个方法,即用each()将调用这个方法的每个元素的disabled属性均设置为true(如果该属性存在)
6、使用jQuery和其他库
例如:Prototype库也是使用$符号,jQuery提供noConflict函数避免冲突,jQuery.noConflict();把$符号还原到非jQuery库定义的含义。
7、文档就绪处理程序,相当于$(document).ready(...)
例如:
$(function(){...}); //里面的函数会在DOM树加载完之后执行
扩展知识:解决"$"的冲突
如果其他框架也是用了“",会引起冲突,jQuery同样提供了noConflict()方法来解决""冲突问题
jQuery.noConflict();
以上代码可以使""按照其他javascript框架的方式运算,这时再jQuery中便不能在使用“”,而必须使用jQuery,
例如$("p p") 必须写成jQuery("p p").
【推荐学习:jQuery视频教程、web前端视频】
Atas ialah kandungan terperinci Apakah yang $ dalam jquery lakukan?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!