- 浏览: 5138054 次
- 性别:
- 来自: 天津
博客专栏
-
实战 Groovy
浏览量:29066
文章分类
- 全部博客 (639)
- 代码之谜 (6)
- JavaScript quirks (5)
- 程序员 (92)
- Java (93)
- BT编程 (7)
- html/css (64)
- Groovy&Grails (42)
- Android (20)
- C/C++ (5)
- PHP/Perl/Python (46)
- 经典文章 (51)
- CodeIgniter (14)
- JQuery (10)
- 笑话 (4)
- 其他 (32)
- javascript (69)
- 云计算 (0)
- html5 (7)
- 面试 (8)
- google (3)
- nosql (2)
- nodejs (11)
- go (5)
- erlang (1)
- 小常识 (3)
- 冷知识 (5)
- database (4)
- web (12)
- 架构 (12)
- Exception (0)
最新评论
-
jqw1992:
https://www.chromefor.com/libra ...
[福利] 开发者必备的 Chrome 插件——ChromeSnifferPlus -
litjerk:
初步算了一下,目前最最精简的Win98版是5M,他5个小时多敲 ...
让人目瞪口呆的三位世界级电脑大师 -
379855529:
。。似乎重点没说NIO啊,前面基础只是铺垫的很好的,可是我要的 ...
Java NIO与IO的详细区别(通俗篇) -
springmvc_springjpa:
spring mvc demo教程源代码下载,地址:http: ...
一步步开发 Spring MVC 应用 -
匡建武:
Good
四个程序员的一天
以下是一些非常有用的jQuery提示和开发技巧。我分享这些,因为我认为他们将是非常有用的给你。声明:我没有写下面的代码,但已经从Internet收集各种来源。
1。优化性能复杂的选择
查询DOM中的一个子集,使用复杂的选择时,大幅提高了性能:
var subset = $(""); $("input[value^='']", subset);
2。设置上下文和提高性能
jQuery核心功能上,指定上下文参数。指定context参数,允许从DOM中更深的分支,而不是从DOM根,jQuery来启动。鉴于一个足够大的DOM,指定上下文参数转化为性能提升。
jQuery核心功能上,指定上下文参数。指定context参数,允许从DOM中更深的分支,而不是从DOM根,jQuery来启动。鉴于一个足够大的DOM,指定上下文参数转化为性能提升。
$("input:radio", document.forms[0]);
3。现场事件处理程序
设置任何一个选择的元素相匹配的事件处理程序,即使它被添加后的初始页面加载到DOM:
$('button.someClass').live('click', someFunction);
这允许你通过Ajax加载内容,或通过JavaScript添加事件处理程序的成立为这些元素正确自动。
同样,要停止现场事件处理:
4。检查索引
jQuery有索引,但它是一种痛苦,使用你所需要的元素的列表,并通过元素你想要的指标
var index = e.g $('#ul>li').index( liDomObject );以下是比较容易:
$("ul > li").click(function () { var index = $(this).prevAll().length; });
如果你想知道在一个集合元素的索引,例如在一个无序列表的列表项:
5。使用jQuery的数据的方法
jQuery的数据()方法是有用的,不为人所熟知。它可以让你无需修改DOM绑定数据到DOM元素。
$("ul > li").click(function () { var index = $(this).prevAll().length; });
6。删除一个元素的淡出效果基本show效果
结合多个jQuery效果,动画和删除DOM元素。
$("#myButton").click(function() { $("#myDiv").fadeTo("slow", 0.01, function(){ //fade $(this).slideUp("slow", function() { //slide up $(this).remove(); //then remove from the DOM }); }); });
7。检查是否存在一个元素
if ($("#someDiv").length) { //hooray!!! it exists... }
使用下面的代码片段来检查一个元素是否存在与否。
8。添加到DOM中动态创建的元素
使用下面的代码片段来动态创建一个DIV,并添加到DOM。
var newDiv = $('<div></div>'); newDiv.attr("id","myNewDiv").appendTo("body");
9。换行符和chainability的
而不是做:
$("a").hide().addClass().fadeIn().hide();
像这样可以增加可读性:
$("a") .hide() .addClass() .fadeIn() .hide();
10。创建自定义选择
$.extend($.expr[':'], { over100pixels: function(a) { return $(a).height() > 100; } });
$('.box:over100pixels').click(function() { alert('The element you clicked is over 100 pixels high'); });
11。克隆在jQuery对象
使用clone()方法。jQuery的方法克隆任何JavaScript中的DOM对象。
// Clone the DIV
var
cloned = $(
'#somediv'
).clone();
jQuery的clone()方法不克隆一个JavaScript对象。克隆JavaScript对象,使用下面的代码。
// Shallow copy
var
newObject = jQuery.extend({}, oldObject);
// Deep copy
var
newObject = jQuery.extend(
true
, {}, oldObject);
12。测试,如果事情是隐藏使用jQuery
我们使用。隐藏()。在jQuery的show()方法来改变元素的知名度。使用以下代码来检查一个元素是否是可见或不可见。
if
($(element).is(
":visible"
) ==
"true"
) {
//The element is Visible
}
13。另一种方式的文件准备就绪
//Instead of
$(document).ready(
function
() {
//document ready
});
//Use
$(
function
(){
//document ready
});
14。选择一个元素。(期),在它的ID
在选择使用反斜杠来选择的元素,在它的ID期间。
$(
"#Address\\.Street"
).text(
"Enter this field"
);
15。计数的直接子元素
如果你要计算所有的div#foo的元素存在于
16。做一个“闪存”的元素
<div id="foo">
<div id="bar"></div>
<div id="baz">
<div id="biz">
</div>
<span><span>
</div>
//jQuery code to count child elements
$("#foo > div").size()
16。做一个“闪存”的元素
jQuery.fn.flash =
function
( color, duration )
{
var
current =
this
.css(
'color'
);
this
.animate( { color:
'rgb('
+ color +
')'
}, duration / 2 );
this
.animate( { color: current }, duration / 2 );
}
//Then use the above function as:
$(
'#importantElement'
).flash(
'255,0,0'
, 1000 );
17。中心元素在屏幕上
jQuery.fn.center =
function
() {
this
.css(
"position"
,
"absolute"
);
this
.css(
"top"
, ( $(window).height() -
this
.height() ) / 2+$(window).scrollTop() +
"px"
);
this
.css(
"left"
, ( $(window).width() -
this
.width() ) / 2+$(window).scrollLeft() +
"px"
);
return
this
;
}
//Use the above function as:
$(element).center();
18。获取父div使用最接近
如果你想找到的包装纸DIV元素(不论该DIV的ID),然后你会想这个jQuery选择:
$(
"#searchBox"
).closest(
"div"
);
19。禁用右键单击上下文菜单
还有许多JavaScript片段禁用右键
单击上下文菜单,但jQuery让事情容易多了:
单击上下文菜单,但jQuery让事情容易多了:
$(document).ready(
function
(){
$(document).bind(
"contextmenu"
,
function
(e){
return
false
;
});
});
20。获取鼠标光标的X和Y轴
这个脚本会显示X和Y值 - 鼠标指针的坐标。
$().mousemove(
function
(e){
//display the x and y axis values inside the P element
$(
'p'
).html(
"X Axis : "
+ e.pageX +
" | Y Axis "
+ e.pageY);
});
发表评论
-
Lo-Dash 与 underscore,Prototype 与 jQuery,两段恩怨情仇
2015-12-15 09:35 1572这几天更新我的之前写的 Chrome 插件 ChromeSn ... -
开发者必备的 Chrome 扩展
2014-11-03 15:01 1932Firebug:不用多介绍了吧https://chrome. ... -
开发者福利!ChromeSnifferPlus 插件正式登陆 Chrome Web Store
2014-10-30 21:14 106468今天(2014-10-30)下午,ChromeSniffer ... -
Firebase 相关文章索引
2014-10-23 10:21 1765Awesome Firebase 最近谷歌收购Fireb ... -
JSON API:用 JSON 构建 API 的标准指南中文版
2014-10-14 08:26 19809译文地址:https://github. ... -
前端开发,从菜鸟到大牛的取经之路
2014-07-14 15:15 378834以我的经验,大部分技术,熟读下列四类书籍即可。 入门, ... -
JavaScript Puzzlers 解密(一):为什么 ["1", "2", "3"].map(parseInt) 返回 [1, NaN, NaN]?
2014-02-19 10:58 39668JavaScript Puzzlers! 被称为 javas ... -
JavaScript 的怪癖 4:未知变量名创建全局变量
2013-12-02 15:25 1339原文:JavaScript quirk 4: unknown ... -
JavaScript 的怪癖 5:参数的处理
2013-12-02 15:23 3190原文:JavaScript quirk 5: parame ... -
jQuery响应式瀑布流布局插件 - Grid-A-Licious
2013-12-02 14:34 15177最近瀑布流布局比较流行,那么今天就给大家介绍一个这样的 j ... -
【ghost初级教程】 怎么搭建一个免费的ghost博客
2013-10-28 14:10 6152ghost博客系统无疑是这个月最火热的话题之一,这个号称” ... -
10 个你需要了解的最佳 javascript 开发实践
2013-10-16 13:54 3565Javascript 的很多扩展的特性是的它变得更加的犀利 ... -
基于 canvas 将图片转化成字符画
2013-09-26 15:05 6530猛点 这里 看高清 ... -
详解一下 javascript 中的比较
2013-09-22 09:30 1883代码1: [] == []; // false ... -
谈 javascript 变量声明
2013-06-14 10:35 1838这篇文章还是对基础的复习,对面试经历的一个总结。 之前的 ... -
[译]Javascript 作用域和变量提升
2013-06-13 13:16 5095下面的程序是什么结果? var fo ... -
javascript:可以运行的噪音
2013-06-01 09:34 9172为我的博客做了一个很有 geek 风格的关于页面。运行下面 ... -
【layoutit!】基于 bootstrap 实现可视化布局工具
2013-05-20 11:23 14554Layout It 是一个在线工具,它可以简单而又快速搭建 ... -
回复:浮点数0.57 0.58 造出的坑爹问题
2013-05-09 11:30 24827今天看到 vb2005xu 提到了一个问题 浮点数0.5 ... -
javascript 中强制执行 toString()
2013-04-26 13:25 1499原文:Enforcing toString() 译文:ja ...
相关推荐
书名:jQuery权威指南(系统介绍jQuery方方面面,囊括118个实例和2个综合案例,实战性强) 作者:陶国荣 著 书号:978-7-111-32543-7 定价:59.00元 出版社:机械工业出版社华章公司 出版时间:2011年1月 编辑推荐:...
超实用的jQuery代码段精选近350个jQuery代码段,涵盖页面开发中绝大多数要点、技巧与方法,堪称史上最实用的jQuery代码参考书,可以视为网页设计与网站建设人员的好帮手。《超实用的jQuery代码段》的代码跨平台、跨...
输入有效信息时会有一些提示语,比如“请输入用户名”和“请输入密码”等语言,这篇文章就为大家介绍js实用技巧之输入框提示语句的实现方法,感兴趣的小伙伴们可以参考一下
主要介绍了jquery悬浮提示框实现方法,涉及jQuery鼠标事件响应及页面元素样式的动态操作技巧,需要的朋友可以参考下
这是一款基于jQuery制作定时提醒闹钟,带音乐,打开本网页后一直运行着就可实现提醒或闹钟的功能,本效果可以实现闹钟时间选定、闹铃类型选择、提示文字设置、重复频率设置都,用上流行的网页浮动效果,无刷新页面...
主要介绍了jquery.validate提示错误信息位置方法,实例分析了jquery.validate实现提示错误信息位置的相关技巧,需要的朋友可以参考下
主要介绍了jquery实现ajax加载超时提示的方法,涉及jQuery中load方法的ajax加载超时设置与提示信息处理技巧,需要的朋友可以参考下
主要介绍了jQuery封装的屏幕居中提示信息代码,可以很方便的集成到项目开发中使用,涉及jQuery针对页面元素的动态操作技巧,需要的朋友可以参考下
主要介绍了jQuery实现新消息闪烁标题提示的方法,实例分析了jQuery操作样式的技巧,具有一定参考借鉴价值,需要的朋友可以参考下
主要介绍了php+mysql+jquery实现简易的检索自动补全提示功能,涉及基于jQuery的ajax数据库查询与事件动态响应相关操作技巧,需要的朋友可以参考下
主要介绍了jquery.qtip提示信息插件用法,结合简单实例形式分析了该插件用于显示提示信息的相关使用技巧,具有一定参考借鉴价值,需要的朋友可以参考下
主要介绍了jQuery简单实现input文本框内灰色提示文本效果的方法,涉及jQuery针对页面元素的遍历与样式动态操作技巧,具有一定参考借鉴价值,需要的朋友可以参考下
主要介绍了jquery.validate自定义验证用法,结合实例形式分析了jQuery成功提示与择要提示验证操作相关实现与使用技巧,需要的朋友可以参考下
主要介绍了开发中可能会用到的几个jQuery小提示和技巧,需要的朋友可以参考下
主要介绍了jQuery提示插件qTip2用法,结合实例形式分析了qTip2的使用技巧,可支持ajax及多种样式的设置,需要的朋友可以参考下
主要介绍了jQuery悬停文字提示框插件jquery.tooltipster.js用法,涉及jQuery文字提示框插件的引入与调用实现技巧,非常简单实用,需要的朋友可以参考下
主要介绍了jquery实现简单文字提示效果的方法,以完整实例形式分析了jQuery插件jquery-1.2.6.pack.js实现文字提示效果的相关技巧,并提供了jquery-1.2.6.pack.js的本站下载地址,需要的朋友可以参考下
这是一款基于jQuery制作定时提醒闹钟,带音乐,打开本网页后一直运行着就可实现提醒或闹钟的功能,本效果可以实现闹钟时间选定、闹铃类型选择、提示文字设置、重复频率设置都,用上流行的网页浮动效果,无刷新页面...