jQuery కేంద్రకం - jQuery() మెథడ్
实例
ఒక div అంశంలో ఉన్న అంశాలను కనుగొని, ప్యారాగ్రాఫ్ అంశాన్ని కాంట్రోల్ చేయండి:
$("div > p").css("border", "1px solid gray");
నిర్వచనం మరియు ఉపయోగం
jQuery() మెథడ్ ఒక స్ట్రింగ్ అన్నింటిలో అంశసమూహాన్ని సరిపోల్చడానికి ఉపయోగించే CSS సెలెక్టర్ ను అంగీకరిస్తుంది.
jQuery() ఫంక్షన్ మూడు రూపాలు కలిగి ఉంటుంది:
సంక్షిప్త రూపం 1
ఒక స్ట్రింగ్ అన్నింటిలో అంశసమూహాన్ని సరిపోల్చడానికి ఉపయోగించే CSS సెలెక్టర్ ను అంగీకరించండి:
jQuery(selector, [context]
సంక్షిప్త రూపం 2
మూల హైలైట్ సాంకేతికతను ఉపయోగించి DOM అంశాన్ని సృష్టించడానికి స్ట్రింగ్ ఉపయోగించండి:
jQuery(html,ownerDocument]
సంక్షిప్త రూపం 3
డాక్యుమెంట్ డామ్ లోకి పూర్తి అయిన తర్వాత అమలు అవుతుంది ఫంక్షన్ ఒకటి బాండ్ చేయండి:
jQuery( callback )
jQuery( selector, [ context ] )
ఈ సింతాక్సిస్ కు కొన్ని ఉపయోగాలు ఉన్నాయి:
ఉపయోగం 1: సెలెక్టర్ ఎన్విరాన్మెంట్ అమర్చుకోండి
语法
jQuery(selector, [context]
అప్రమేయంగా, సెలెక్టర్ డాక్యుమెంట్ మూలం నుండి DOM ను శోధిస్తుంది. అయితే, $() కు ఆప్షనల్ కంటెక్స్ట్ పారామీటర్ ను అందిస్తారు.
ఉదాహరణకు, మేము ఒక కాల్బ్యాక్లో ఒక అంశాన్ని కనుగొనడానికి కావలసినప్పుడు, క్రింది శోధనను నిర్ణయించవచ్చు:
实例
$("div.foo").click(function() { $("span", this).addClass("bar"); });
由于我们已经将 span 选择器限定到 this 这个环境中,只有被点击元素中的 span 会得到附加的 class。
在内部,选择器环境是通过 .find() 方法实现的,因此 $("span", this) 等价于 $(this).find("span")。
jQuery 的核心功能都是通过这个函数实现的。jQuery中的一切都基于这个函数,或者说都是在以某种方式使用这个函数。这个函数最基本的用法就是向它传递一个表达式(通常由 CSS 选择器组成),然后根据这个表达式来查找所有匹配的元素。
默认情况下, 如果没有指定 context 参数,$() 将在当前的 HTML document 中查找 DOM 元素;如果指定了 context 参数,如一个 DOM 元素集或 jQuery 对象,那就会在这个 context 中查找。在 jQuery 1.3.2 以后,其返回的元素顺序等同于在 context 中出现的先后顺序。
用法 2 :使用 DOM 元素
语法
jQuery(element)
该函数允许我们通过使用以其他方式找到的 DOM 元素来创建 jQuery 对象。该功能通常的用法是,对已经通过 this 关键字传递到 callback 函数的元素调用 jQuery 的方法:
实例
$("div.foo".click(function() { $(this).slideUp(); });
ఈ ఉదాహరణ ఎలిమెంట్ను క్లిక్ చేసినప్పుడు స్లైడ్ అనిమేషన్ ద్వారా ఎలిమెంట్ను మరింత పరిమితం చేయడానికి ఉపయోగిస్తుంది. ప్రాసెసర్ అందించే this కీలక వాక్యంలో క్లిక్ చేసిన ఎలిమెంట్ స్పష్టంగా DOM ఎలిమెంట్ అని కాకపోతే, అది జేక్వర్నీ మాదిరిగా అనుమతించబడుతుంది ముందు, అది జేక్వర్నీ ఆబ్జెక్ట్గా వాపించాలి.
ఈ ఫంక్షన్కు పారామీటర్లుగా XML డాక్యుమెంట్స్ మరియు విండో ఆబ్జెక్ట్లను (వారు DOM ఎలిమెంట్స్ కాదు) అంగీకరిస్తుంది.
ఏక్సియంజిల్ డాటా ఏజెక్స్ కాల్ నుండి వెళ్లిపోతే, మేము $() ఫంక్షన్ను ఉపయోగించి ఆ డాటాను jQuery ఆబ్జెక్ట్గా వాపించవచ్చు. పూర్తయినప్పుడు, మేము .find() మరియు ఇతర DOM పరిశీలన మాదిరిగా ముందుకు తీసుకురావచ్చు సింగిల్ ఎలిమెంట్స్ను వారిని అనుసరించవచ్చు.
ఉపయోగం 3: jQuery ఆబ్జెక్ట్ను క్లోన్ చేయడం
语法
jQuery(jQuery ఆబ్జెక్ట్)
ఎప్పుడు jQuery ఆబ్జెక్ట్ను $() ఫంక్షన్కు పారామీటర్ రూపంలో అందిస్తే, ఆ ఆబ్జెక్ట్ని కాపీ చేస్తుంది. ప్రారంభ ఆబ్జెక్ట్తో సమానంగా, కొత్త jQuery ఆబ్జెక్ట్లు అదే DOM ఎలిమెంట్స్ను సూచిస్తాయి.
用法 4 :返回空的集合
语法
jQuery()
对于 jQuery 1.4,调用无参数的 jQuery() 方法会返回空的 jQuery 集合。在之前版本的 jQuery 中,这样会返回包含 document 节点的集合。
jQuery( html, [ ownerDocument ] )
ఈ సింతాక్సిస్ కు కొన్ని ఉపయోగాలు ఉన్నాయి:
ఉపయోగం 1: కొత్త ఎలిమెంట్స్ సృష్టించడం
语法
jQuery(html,ownerDocument]
మీరు ఒక హెచ్ఎంఎల్ స్ట్రింగ్ ను హాండ్ రైట్ చేయవచ్చు, లేదా కొన్ని ట్యాంప్లేట్ ఇంజిన్స్ లేదా ప్లగ్ఇన్స్ ద్వారా సృష్టించబడిన స్ట్రింగ్ ను, లేదా AJAX ద్వారా లోడు చేసిన స్ట్రింగ్ ను పంపవచ్చు. కానీ మీరు input ఎలిమెంట్స్ సృష్టించటం సమయంలో కొన్ని పరిమితులు ఉన్నాయి, రెండవ ఉదాహరణను సమానంగా చూడండి.
ఈ స్ట్రింగ్ స్లాష్ (/) లేదా బ్యాక్ స్లాష్ (\) ని కలిగి ఉండవచ్చు, మరియు మీరు ఒక సింగిల్ ఎలిమెంట్ సృష్టించడానికి వాడవచ్చు. ఉదాహరణకు, ఒక span సృష్టించడానికి $("<span/>") లేదా $("<span></span>") ఉపయోగించవచ్చు, కానీ $("<span>") ఉపయోగించకుండా ఉండడం నిర్ణయించబడింది. జూనీరీ లో, ఈ సింథెక్సిస్ డాక్యుమెంట్ సృష్టించడానికి సమానం ఉంటుంది అని జూనీరీ లో చెప్పబడింది.
అనేక పారామీటర్స్ రూపంలో స్ట్రింగ్ ను $() కు పంపించినప్పుడు, jQuery స్ట్రింగ్ హెచ్ఎంఎల్ అని తెలుసుకోగలదు (ఉదాహరణకు, స్ట్రింగ్ కొన్ని స్థానాల్లో టాగ్స్ ఉన్నాయి). కానీ అని లేకపోతే, స్ట్రింగ్ ఒక సెలెక్టర్ ఎక్స్ప్రెషన్ గా గుర్తించబడుతుందు, దానికి పైన ఉన్న వివరణను చూడండి. కానీ స్ట్రింగ్ హెచ్ఎంఎల్ ఫ్రేగ్మెంట్ ఉంటే, jQuery ఆ హెచ్ఎంఎల్ ఫ్రేగ్మెంట్ ద్వారా వర్ణించబడిన DOM ఎలిమెంట్స్ సృష్టించడానికి ప్రయత్నిస్తుంది. ఆపై, ఆ DOM ఎలిమెంట్స్ ని సూచించే ఒక jQuery ఆబ్జెక్ట్ సృష్టించి తిరిగి ఇవ్వబడుతుంది:
实例
$("<p id="test">My <em>new</em> text</p>").appendTo("body");
ఇక్కడ ఉన్న ఉదాహరణలో వంటి హెచ్ఎంఎల్ ఫ్రేగ్మెంట్ అనేది అటిరిబ్యూట్స్ లేని సాధారణ టాగ్స్ కంటే కఠినంగా ఉంటే, అప్పుడు బ్రౌజర్ యొక్క innerHTML మెకానిజం ద్వారా వాస్తవిక ఎలిమెంట్ సృష్టించబడుతుంది. ప్రత్యేకంగా, jQuery కొత్త <div> ఎలిమెంట్ సృష్టిస్తుంది మరియు సంబంధించిన హెచ్ఎంఎల్ ఫ్రేగ్మెంట్ కు ఎలిమెంట్ యొక్క innerHTML అటిరిబ్యూట్ ని సెట్ చేస్తుంది. పారామీటర్ కేవలం సాధారణ టాగ్స్ ఉంటే, ఉదాహరణకు $("<img />") లేదా $("<a></a>"), jQuery స్వంతమైన JavaScript createElement() ఫంక్షన్ ద్వారా ఎలిమెంట్ సృష్టిస్తుంది.
要确保跨平台兼容性,片段的结构必须良好。能够包含其他元素的标签必须成对出现(带有关闭标签):
$("");
不过,jQuery 也允许类似 XML 的标签语法:
$("");
无法包含其他元素的标签可以关闭,也可以不关闭:
$(""); $("");
用法 2 :设置属性和事件
语法
jQuery(html,props)
对于 jQuery 1.4,我们可以向第二个参数传递一个属性映射。该参数接受能够传递给 .attr() 方法的属性的超集。此外,可以传递任意的事件类型,并可以调用下面的 jQuery 方法:val, css, html, text, data, width, height, or offset.
注意,Internet Explorer 不允许你创建 input 元素并改变其类型;您必须使用例如 "" 来规定类型。
实例
创建一个 元素,同时设定 type 属性、属性值,以及一些事件。
$("", { type: "text", val: "Test", focusin: function() { $(this).addClass("active"); }, focusout: function() { $(this).removeClass("active"); } }).appendTo("form");
jQuery( callback )
允许你绑定一个在 DOM 文档载入完成后执行的函数。
该函数的作用如同 $(document).ready() 一样,只不过用这个函数时,需要把页面中所有需要在 DOM 加载完成时执行的其他 $() 操作符都包装到其中来。尽管从技术上来说,这个函数是可链接的,但真正以这种方式链接的情况并不多。
ఉదాహరణ
డాక్యుమెంట్ లోడింగ్ పూర్తి అయినప్పుడు కాల్పనిక ఫంక్షన్స్ ను అమలు చేయండి:
$(function(){ // పత్రం సమాప్తమైనప్పుడు });