码迷,mamicode.com
首页 > Web开发 > 详细

JQuery

时间:2018-05-12 22:35:22      阅读:200      评论:0      收藏:0      [点我收藏+]

标签:css   append   数组   数据类型   this   change   文本   处理   浏览器   

一对象:

isEmptyObject() 检查一个对象是否包含任何属性,包括继承的属性,和对象的类型无关
$.isEmptyObject("");//返回true;
$.isEmptyObject({ });//返回true;

isPlainObject() 用于检查一个对象是否包含任何属性,但它所检查的必须是一个object的实例。
$.isPlanObject("");//返回 false
$.isPlanObject({ });//返回 true
$.isPlanObject(new Object);//返回 true

操作对象:
extend()方法来合并两个或者两个以上的对象,是将一个或者多个的属性合并到一个目标对象之中。
var obj1={"1":"property 1"};
var obj2={"2":"property 2"};
var obj3={"3":"property 3"};
$.extend(obj1,obj2,obj3);
console.log(obj1["3"]);//显示属性3的值

可以使用它来克隆javaScript对象(这与¥。clone()方法不同);
varcloned object= ¥。extend({},anobject);
$.extend()方法还可以接受一个布尔值作为第一个参数,用于执行对象的深度合并,即递归复制。可以使用该方法来实现对象的深度克隆
var clonedObject = $.extend(truem{},anObject);

二函数:
isFunction(),用于检查一个对象是否是函数。去掉函数名的圆括号。
noop() 方法是一个存根函数(stub function),并不执行任何操作,比如把一个空函数作为参数传递,以便安装一个在默认情况下不执行任何操作的新事件。

三数组操作:
isArray(),检查一个对象是否是一个数组
makeArray(),将一个类似数组的对象转换成一个真正的数组,将丢失该对象的所有方法和属性
merge(),从第2个数组中获取元素,并将这些元素追加到第一个数组中并保留两个数组中元素的原有顺序
inArray(),用于检查数组中是否存在某个指定的值,如果存在返回索引,不存在返回-1
unique(),从DOM元素的数组中移除重复的元素(#可以是多个#)
each(),索引是基于0的,接受两个参数:第一个参数是要遍历的集合,第二个回调函数。
$.each([1,2,3,4],function(index,value){
value=value*2
console.log("index is:"+index+"new value is:"+value);
})
map(),语法和each()类似,接受两个参数,一个是数组对象或者类似于数组对象,第二个参数是一个回调函数,该回调函数接受两个参数,第一个参数是当前元素的值,第二个参数是当前元素在数组中的索引。

四数据结构:
queue(),来维护一个函数的列表
dequeue(),可以从队列中移除一个函数并执行它
slideUp(),滑入
fadeIn(),淡入

五字符串:
trim(),JavaScript内置的String对象并不包含.trim()方法。移除字符首位空格字符

六数据:
ajax 有两种最主要的数据交换格式,一是XML,二是JSON。
parseXML()和parseJSON()方法来解析这两种格式的数据,既可解析本地数据,也可以解析URL制定的数据
data()可以将任意数据附加到HTML元素,可以存储和取回数据


。。。多级下拉框菜单
//使用live()方法,因为下拉列表框在页面加载时还不存在

$("[name=‘stateCombo‘]").live("change",function(event){
var selectedState=$(this).val();

var CA_Cities = ["1","2","3"];
var FL_Cities = ["4","5","6"];
var cities=[];
if(selectedState==0){
cities=$.extend([],CA_Cities);
}else if(selectedState==1){
cities=$.entend([],FL_Cities);
}
//清除cityCombo中任何之前的值
$("[name=‘cityCombo‘]").empty();
$.each(cities,function(index,value){
$("[name=‘cityCombo‘]").append("<option value=‘+index+‘>"+value	+"</option>")
})
})

  

。。。不允许出现空值

//获取各个输入框的值
var userName = $(‘input[name="userName"]‘).val();
var email = $(‘input[name="email"]‘).val();
var age = $(‘input[name="age"]‘).val

//不允许出现空值
var hasValue = userName&&email&&age
if(!hasValue){
$("#msg")
.append("All Fields are required.")
.css("color","red");
return false;

}

  

//禁用Add Location 按钮,避免重复点击该按钮添加重复的下拉框的下拉列表框
$(this).attr("disabled","disabled");

 

.bind()
.unbind()
.live()
.die()
.clike()
.blur


.on
.off

//监听id为delegate的div元素上的click事件,如果点击了<p>元素,则触发指定的事件处理程序

$("#delegate").on("click","p",function(){
console.log(‘ouch‘);
}).css("color","green");

  

//移除前面示例中绑定的事件:
$("#delegate").off("click","p");

jQuery统一的事件处理机制,不必担心不同浏览器之间的差异。

 

$.data(element,key,value);

$.data(element,key);

$(function(){
$("#randomEl").data("itemPrice","1999");
});

  

HTML5引入了用户自定义数据属性,任何以data-为前缀的属性都可以在标准化的,以编程方式访问的脚本代码中使用

临时默认文本placeholder 的属性来支持
<input type="text" placeholder="Enter your name">

首先使用Modernizr库来检测浏览器是否支持placeholder属性,然后编写jquery代码来弥补不足

$(function(){
	if(!Modernizr.input.placeholder){
		if(‘input[type=text]‘).focus(function(){
			if($(this).val()===$(this).attr(‘placeholder‘)){
				$(this).val(‘‘);
				}
			});
		$(‘input[type=text]‘).blur(function(){
			if($(this).val()===‘‘){
			$(this).val($(this).attr(‘placeholder‘));	
			}
		});
	}
});

  

onreadystatechange事件和回调函数
返回的有效数据类型包括:XML,HTML,JSON,JSONP,text,script。

(json才是目的,jsonp只是手段)
json返回的是一串数据;而jsonp返回的是脚本代码(包含一个函数调用);

jQuery提供了一个快捷方法$.getJSON(),它以异步方式从服务器获取JSON格式的数据
$.getJSON("/url/2/get/json.php",function(data,text,jqXHR){
//在这里处理回掉函数中的任务
};
遗憾的是,jQuery没有提供对应的$.postJSON()方法。

 

Number(value)//转换成数字
Math.abs(value)//转换成绝对值

//是否置顶样式。
sylte="z-index : 0"


//获取选中select 自定义属性
objindex.id = $("#net_sel_allmarket_one").find("option:selected").attr("value");

break跳出当前最近的循环,也就是一层。

如果要跳出任意循环可以给要跳出的循环命名。比如以下代码可以直接跳出最外层的循环。

loop: for(int i = 0; i<n ; i++){
  for(int i = 0; j<n ;j++){
    for(int k = 0; k<n; k++){
    ...;  
    break loop;
    }
  }
}

  

 

JQuery

标签:css   append   数组   数据类型   this   change   文本   处理   浏览器   

原文地址:https://www.cnblogs.com/yituzimin/p/9030017.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!