1.jquery鉴之show()/hide()
2.å
³äºjQuery 代ç ç书åå½¢å¼
jquery鉴之show()/hide()
jQuery中show()和hide()方法用于控制元素的源码显示与隐藏。从字面理解,设置show()方法显示元素,源码hide()方法隐藏元素。设置calendar函数源码在JavaScript中,源码显示与隐藏元素通常有两种方法:一种是设置修改CSS样式中的display属性,设置display为'none'实现隐藏。源码另一种是设置修改CSS样式中的opacity属性,在0到1之间调整实现从隐藏到显示的源码变化。
show()方法的设置使用格式为:show(speed,callback)。其中speed参数可选,源码随机访问 源码用于指定元素从可见到隐藏的设置速度,默认为"0"。源码callback参数同样可选,设置用于指定在方法执行完毕后要执行的源码函数。
show()方法主要通过控制display属性实现元素的源码窗口隐藏显示与隐藏。在jQuery源码中,show()方法通过调用showHide()方法实现元素的显示或隐藏。
在分析show()方法的源码时,我们首先需要了解toggle()方法。toggle()方法用于切换show()和hide()的全名砍价源码执行,其实质是这两个方法的集合。jQuery.js中的方法按照类型进行分组,相同类型的函数位于同一扩展包内,这种结构使得代码更加简洁、易于阅读。装修模板源码
show()方法首先触发show或hide事件,然后调用showHide()方法进行处理。showHide()方法对输入的元素进行封装,并根据传入的speed参数调用jQuery.fn['show']方法或animate()方法进行元素显示或隐藏操作。
在showHide()方法中,会遍历elements参数,将display属性设置为值,并对每个元素进行处理。具体来说,对于hide()方法,会将目标节点的display属性设置为'none'。对于show()方法,则会先判断目标节点的display属性是否为'none',如果是,则将display属性设置为空字符串,实现显示效果。
总结而言,show()和hide()方法通过控制display属性实现元素的显示与隐藏。每次调用时,都会根据目标元素的当前display状态进行相反的赋值操作。这样的设计使得代码简洁且易于理解和维护。
å ³äºjQuery 代ç ç书åå½¢å¼
1ãå®ä¹jQueryåéçæ¶åæ·»å varå ³é®åããè¿ä¸ªä¸ä» ä» æ¯jQueryï¼ææjavascriptå¼åè¿ç¨ä¸ï¼é½éè¦æ³¨æï¼ä¸è¦å®ä¹æå¦ä¸ï¼
$loading = $('#loading'); //è¿ä¸ªæ¯å ¨å±å®ä¹2ã使ç¨ä¸ä¸ªvaræ¥å®ä¹åé
ããå¦æ使ç¨å¤ä¸ªåéçè¯ï¼å¦ä¸æ¹å¼å®ä¹ï¼
var page = 0,$loading = $('#loading'),
$body = $('body');
ä¸è¦ç»æ¯ä¸ä¸ªåéé½æ·»å ä¸ä¸ªvarå ³é®å
3ãå®ä¹jQueryåé
ããç³ææè å®ä¹åéçæ¶åï¼è¯·è®°ä½å¦æå®ä¹çæ¯jQueryçåéï¼æ·»å ä¸ä¸ª$符å·å°åéåï¼å¦ä¸ï¼
var$loading = $('#loading');è¿éå®ä¹æè¿æ ·ç好å¤å¨äºï¼ å¯ä»¥ææçæ示èªå·±æè å ¶å®é 读 代ç çç¨æ·ï¼è¿æ¯ä¸ä¸ªjQueryçåé
4ãDOMæä½è¯·å¡å¿ è®°ä½ç¼åï¼cacheï¼
å¨jQuery代ç å¼åä¸ï¼å¸¸å¸¸éè¦æä½DOMï¼DOMæä½æ¯é常æ¶èèµæºçä¸ä¸ªè¿ç¨ï¼èå¾å¾å¾å¤äººé½å欢è¿æ ·ä½¿ç¨jQueryï¼
$('#loading').html('å®æ¯');$('#loading').fadeOut();
代ç 没æä»»ä½é®é¢ï¼ ä¹å¯ä»¥æ£å¸¸è¿è¡åºç»æï¼ä½æ¯è¿é注æ æ¯æ¬¡å®ä¹å¹¶ä¸è°ç¨$('#loading')çæ¶åï¼é½å®é å建äºä¸ä¸ªæ°çåéï¼å¦æ éè¦éç¨çè¯ï¼è®°ä½ä¸å®è¦å®ä¹å°ä¸ä¸ªåééï¼è¿æ ·å¯ä»¥ææçç¼ååéå 容ï¼å¦ä¸ï¼
var $loading = $('#loading');$loading.html('å®æ¯');$loading.fadeOut();
è¿æ ·æ§è½ä¼æ´å¥½ã
5ã使ç¨é¾å¼æä½
ããä¸é¢é£ä¸ªä¾åï¼å¯ä»¥åçæ´ç®æ´ä¸äºï¼
var $loading = $('#loading');$loading.html('å®æ¯').fadeOut();
6ãç²¾ç®jQuery代ç
ããå°½éæ代ç é½æ´åå°ä¸èµ·ï¼è¯·å¿è¿æ ·ç¼ç ï¼
// ï¼ï¼åé¢äººç©$button.click(function(){$target.css('width','%');
$target.css('border','1px solid #');
$target.css('color','#fff');
});
åºè¯¥è¿æ ·ä¹¦åï¼
$button.click(function(){$target.css({ 'width':'%','border':'1px solid #','color':'#fff'});
});
7ãé¿å 使ç¨å ¨å±ç±»åçéæ©å¨
ãã请å¿å¦ä¸æ¹å¼ä¹¦åï¼ãã $('.something > *');
ããè¿æ ·ä¹¦åæ´å¥½ï¼
ãã $('.something').children();
8ãä¸è¦å å å¤ä¸ªID
ãã请å¿å¦ä¸ä¹¦åï¼ãã $('#something #children');
ããè¿æ ·ä¹¦åæ´å¥½ï¼
ãã $('#children');
9ãå¤ç¨é»è¾å¤æ||æè &&æ¥æé
ã
ã请å¿å¦ä¸ä¹¦åï¼if(!$something) {
$something = $('#something ');
}
ããè¿æ ·ä¹¦åæ§è½æ´å¥½ï¼
$something= $something|| $('#something');
ãå°½é使ç¨æ´å°ç代ç
ãã
ä¸å ¶è¿æ ·ä¹¦åï¼if(string.length > 0){ ..}ããä¸å¦è¿æ ·ä¹¦åï¼if(string.length){ ..}
ãå°½éä½¿ç¨ .onæ¹æ³
ããå¦æ 使ç¨æ¯è¾æ°çæ¬çjQueryç±»åºçè¯ï¼è¯·ä½¿ç¨.onï¼å ¶å®ä»»ä½æ¹æ³é½æ¯æç»ä½¿ç¨.onæ¥å®ç°ç
ãå°½é使ç¨ææ°çæ¬çjQuery
ããææ°çæ¬çjQueryæ¥ææ´å¥½çæ§è½ï¼ä½æ¯ææ°ççæ¬å¯è½ä¸æ¯æie6/7/8ï¼æ以大家éè¦èªå·±é对å®é æ åµéæ©
ãå°½é使ç¨åççJavascript
ããå¦æ使ç¨åççJavascriptä¹å¯ä»¥å®ç°jQueryæä¾çåè½çè¯ï¼æ¨è使ç¨åççjavascriptæ¥å®ç°