专注收集记录技术开发学习笔记、技术难点、解决方案
网站信息搜索 >> 请输入关键词:
您当前的位置: 首页 > jQuery

JQuery其余常用函数

发布时间:2010-05-20 14:01:29 文章来源:www.iduyao.cn 采编人员:星星草
JQuery其他常用函数

isArray(obj)                      检测obj否为一个数组对象

isFunction(obj)                 检测obj否为一个函数

isEmptyObject(obj)          检测obj否为一个空对象

isPlainObject(obj)            检测obj否为一个纯粹对象(是否是通过{ }或new Object()关键字创建的)

data()函数

$(selector).data(name,value)        向被选元素附加数据

$(selector).data(name)                  从被选元素中返回附加的数据

$(selector).data(object)                 使用带有名称/值对的对象向被选元素添加数据

向元素附加数据,然后取回该数据:

$("#btn1").click(function(){
  $("div").data("greeting","Hello World");
});
$("#btn2").click(function(){
  alert($("div").data("greeting"));
});

 

从元素中删除之前添加的数据:

$("#btn2").click(function(){
  $("div").removeData("greeting");
  alert("Greeting is: " +$("div").data("greeting"));
});

 

map()函数

map(array,function(elementOfArray,indexOfArray))

grep是过滤数组中的元素,map是按指定要求修改数组中的所选元素

将一组元素转换成其他数组(不论是否是元素数组);

<p><b>Values:</b></p>
<form>
  <input type="text"name="name" value="John"/>
  <input type="text"name="password" value="password"/>
  <input type="text"name="url" value="http://ejohn.org/"/>
</form>
 

exampl:

$("p").append($("input").map(function(){
  return $(this).val();
}).get().join(",") );
result:  <p>John, password, http://ejohn.org/</p>
 
$.map(attr,function(ele,index){
      if(ele>5&&index<8){
             return ele+1;
      } //将数组中元素值大于5并且序号小于8的元素加1
});

$.param()函数

$.param(object,[traditional])

object表示要被序列化的对象,该对象可以是数组、JQuery对象、普通对象

traditional表示是否通过普通的方式浅层序列化,返回序列化后的字符串

var myObject = {
  a: {
    one: 1,
    two: 2,
    three: 3
  },
  b: [1,2,3]
};
var recursiveEncoded = $.param(myObject);
var recursiveDecoded= decodeURIComponent($.param(myObject));
 
alert(recursiveEncoded);
alert(recursiveDecoded);

recursiveEncoded和 recursiveDecoded 的值输出如下:

a%5Bone%5D=1&a%5Btwo%5D=2&a%5Bthree%5D=3&b%5B%5D=1&b%5B%5D=2&b%5B%5D=3

a[one]=1&a[two]=2&a[three]=3&b[]=1&b[]=2&b[]=3

 

如果被传递的对象在数组中,则必须是以.serializeArray() 的返回值为格式的对象数组

[
  {name: 'firstname', value: 'Hello'},
  {name: 'lastname', value: 'World'},
  {name: 'alias'}, // 值为空
]

$.proxy()函数

接受一个函数,然后返回一个新函数,并且这个新函数始终保持了特定的上下文(context )语境,这个方法通常在向一个元素上附加事件处理函数时,上下文语境实际是指向另一个对象的情况下使用。

 

另外,jQuery 能够确保即使你绑定的函数是经过 jQuery.proxy() 处理过的函数,你依然可以用原先的函数来正确地取消绑定。

jQuery.proxy(function, context )

function将要改变上下文语境的函数。

context函数的上下文语境(`this`)会被设置成这个object 对象。

 

jQuery.proxy(context, name )

context函数的上下文语境会被设置成这个 object 对象。

name将要改变上下文语境的函数名(这个函数必须是前一个参数 ‘context’ 对象的属性)

<pre name="code" class="javascript">var objMyInfo = {
      name : "clf",
      sex : "男",
      ShowEvent : function(){
             alert(this.name+"****"+this.sex);
      }
}
 
$("#bnt").bind("click",$.proxy(objMyInfo.ShowEvent,objMyInfo));

如果不用proxy函数,则出发click 事件时,调用objMyInfo.ShowEvent函数,此函数内的this关键字将指向非objMyInfo上下文,那么,this.name和this.sex都将是一个undifined的变量


$.trim(“  text  ”)

去除字符前后的空格

$.support

浏览器检测函数

boxModel: 如果这个页面和浏览器是以W3CCSS盒式模型来渲染的,则等于true。通常在IE 6和IE 7的怪癖模式中这个值是false。在document准备就绪前,这个值是null。

cssFloat: 如果用cssFloat来访问CSS的float的值,则返回true。目前在IE中会返回false,他用styleFloat代替。

hrefNormalized: 如果浏览器从getAttribute("href")返回的是原封不动的结果,则返回true。在IE中会返回false,因为他的URLs已经常规化了。

htmlSerialize: 如果浏览器通过innerHTML插入链接元素的时候会序列化这些链接,则返回true,目前IE中返回false。

leadingWhitespace: 如果在使用innerHTML的时候浏览器会保持前导空白字符,则返回true,目前在IE 6-8中返回false。

noCloneEvent: 如果浏览器在克隆元素的时候不会连同事件处理函数一起复制,则返回true,目前在IE中返回false。

objectAll: 如果在某个元素对象上执行getElementsByTagName("*")会返回所有子孙元素,则为true,目前在IE 7中为false。

opacity: 如果浏览器能适当解释透明度样式属性,则返回true,目前在IE中返回false,因为他用alpha滤镜代替。

scriptEval: 使用appendChild/createTextNode 方法插入脚本代码时,浏览器是否执行脚本,目前在IE中返回false,IE使用 .text 方法插入脚本代码以执行。

style: 如果getAttribute("style")返回元素的行内样式,则为true。目前IE中为false,因为他用cssText代替。

tbody: 如果浏览器允许table元素不包含tbody元素,则返回true。目前在IE中会返回false,他会自动插入缺失的tbody。

 

 

友情提示:
信息收集于互联网,如果您发现错误或造成侵权,请及时通知本站更正或删除,具体联系方式见页面底部联系我们,谢谢。

其他相似内容:

  • jQuery搜索框输入文字下拉揭示菜单

    jQuery搜索框输入文字下拉提示菜单 jQuery搜索框输入文字下拉提示菜单 原文地址: http://www.jq22.com/jquery-info6193 ...

  • 7个替开发者准备的有用的jQuery技巧

    7个为开发者准备的有用的jQuery技巧 一、在新窗口打开链接 用下面的代码,你点击链接即可在新窗口打开: $(document).ready(fu...

  • jQuery获取呼应Input例子

    jQuery获取相应Input例子 页面上有许多input框,使用的是EasyUI样式,中间还参杂着各种其他无id的Input框,如下: <input class=...

  • webpack 引出jquery和第三方jquery插件

    webpack 引入jquery和第三方jquery插件 1、引入jquery jQuery 直接在 html 中引入,然后在 webpack 中把它配置为全局即可。 index....

  • JQuery的开发与使用经验

    JQuery的开发与使用心得 关于jQuery的 入门使用jQuery可以很容易或具有挑战性的,这取决于你如何使用JavaScript,HTML,CSS进行开发和...

  • 深入学习jQuery卡通片控制

    深入学习jQuery动画控制 &times; 目录 [1]动画状态 [2]停止动画 [3]动画延迟[4]全局控制 前面的话   jQuery动画可以使用fade、...

  • jquery操作table报表

    jquery操作table表格 一、数据准备 <table id="table1"> <tr><th>文章标题</th><th>文章分类</th><th>发布时间</th><th>...

  • html + css + jquery实现简略的进度条实例

    html + css + jquery实现简单的进度条实例 <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-eq...

  • jquery中ajax方法的datatype的功用

    jquery中ajax方法的datatype的作用 今天在维护一个项目的时候遇见了一个小问题。但是这个问题我认为对于项目十分有帮助。...

  • jQuery菜单示范(全选,反选,取消)

    jQuery菜单示例(全选,反选,取消) 1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <titl...

热门推荐: