Jquery字符串,数组(拷贝、删选、合并等),each循环,阻止冒泡,ajax出错,$.grep筛选,$.param序列化,$.when
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Jquery测试</title>
<script src="~/Js/jquery-3.1.1.min.js"></script>
<style>
#content {
width: 140px;
border: 1px solid blue;
} #msg {
width: 100px;
height: 100px;
margin: 20px;
border: 1px solid red;
}
</style>
<script type="text/javascript">
//字符串替换
var myStr = "I,love,you,Do,you,love,me?";
var replacedStr = myStr.replace(/love/g, "hate"); //全局替换
console.info(replacedStr) //"I,hate,you,Do,you,hate,me" //字符串连接 concat方法可以接收任意多个参数
var str1 = "I,love,you!";
var str2 = "Do,you,love,me?";
var str = str1.concat(str2,"张三");//"I,love,you!Do,you,love,me?张三"
console.info(str) //字符串大小写
var lowCaseStr = myStr.toLowerCase();//"i,love,you,do,you,love,me";
var upCaseStr = myStr.toUpperCase();//"I,LOVE,YOU,DO,YOU,LOVE,ME"
console.info(lowCaseStr)
console.info(upCaseStr) //Join
//var myList = new Array("jpg", "bmp", "gif", "ico", "png");
var myList = ["jpg", "bmp", "gif", "ico", "png"];
var portableList = myList.join("|");
console.info(portableList) //each循环一
var arr = ["one", "two", "three", "four"];
//数组删除
delete arr[0]; //只是被删除的元素变成了 undefined 其他的元素的键值还是不变。
$.each(arr, function (i) {
console.info(arr[i]);
}); //each循环二
var arr2 = [
{ id: 100, name: "张三", age: 21, sex: "男" },
{ id: 101, name: "李强", age: 22, sex: "男" },
{ id: 102, name: "王琳", age: 20, sex: "女" },
{ id: 103, name: "赵倩", age: 19, sex: "女" }
];
$.each(arr2, function (i, item) { //i序号 item当前元素
console.info(item.id + "-" + item.name + "-" + item.age + "-" + item.sex);
}); $.each(arr2, function (i, item) {
if (item.id == 100) { //修改某条记录
item.name = "胡星";
item.age = "29";
item.sex = "男";
}
console.info(item.id + "-" + item.name + "-" + item.age + "-" + item.sex);
}); $(function () {
//取消后续执行内容 阻止点击链接跳转
var obj = document.getElementById("myhref");
obj.onclick = function (event) {
event = event || window.event;
if (event.preventDefault) {
//非IE下
event.preventDefault();
} else {
event.returnValue = false;
}
}; //ajax出错调试
$.ajax({
url: "www.baidu.com/xxx.php",
type: "post",
datatype: "json",
data: { "cat": "tom", "mouse": "jack" },
success: function (data) {
console.log(data);
},
error: function (jqXHR, textStatus, errorThrown) {
/*
而jqXHR对象如下,
1.readyState :当前状态,0-未初始化,1-正在载入,2-已经载入,3-数据进行交互,4-完成。
2.status :返回的HTTP状态码,比如常见的404,500等错误代码。
3.statusText :对应状态码的错误信息,比如404错误信息是not found,500是Internal Server Error。
4.responseText :服务器响应返回的文本信息
textStatus和errorThrown都是字符串类型,分别是返回的状态和服务器的错误信息。
*/
console.log(jqXHR);
console.log(textStatus);
console.log(errorThrown);
}
}); //阻止冒泡事件(冒泡事件就是点击子节点,会向上触发父节点,祖先节点的点击事件。)
// 为内层div绑定click事件
$("#msg").click(function () {
alert("我是小div");
event.stopPropagation(); // 阻止事件冒泡 只弹出 "我是小div"
});
// 为外层div元素绑定click事件
$("#content").click(function () {
alert("我是大div"); //点击会弹出 "我是大div" 然后弹出 "我是body"
});
// 为body元素绑定click事件
$("body").click(function () {
alert("我是body");
}); //筛选符合条件的元素,返回一个新数组
var arr = [2, 5, 34, 22, 8];
var arr1 = $.grep(arr, function (value, index) {
return index <= 2 && value < 10;
})
console.log(arr1.join(",")); //输出2,5 //去左右空格
var str = " 你在他乡还好吗? ";
console.log("11" + str + "11");
console.log("11" + $.trim(str) + "11"); //如果数组中存在被搜索元素,则返回被搜索元素的索引
var aa = [1, 2, 3, 4, 5];
console.log($.inArray(4, aa)); //弹出 3 //$.makeArray()将数组或类数组对象的属性复制到一个新的数组(真的是数组)中
var arr1 = $.makeArray(arr);
console.log("新数组" + arr1.join(",")); //该函数接受两个数组或类数组对象,将第二个参数附加到第一个参数上面,
//返回第一个参数,第一个数组会修改,第二个不会。
var arr3 = $.merge(arr, aa);
console.log("合并后的数组" + arr3.join(","))
}); //$.param() 序列化成url字符串
$(function () {
var man = { Name: "张飞", Age: 23 };
var str = $.param(man);
console.log(str); //Name=%E5%BC%A0%E9%A3%9E&Age=23
var str1 = decodeURI(str);
console.log(str1); //Name=张飞&Age=23 //$.parseJSON() 该函数会解析JSON格式的字符串,并返回解析结果(对象)。 类似于JSON.parse()
var man = { name: "张三", age: 23 };
var str = JSON.stringify(man); //stringify用于从一个对象解析出字符串 console.log(str); //{"name":"张三","age":23}
var man1 = $.parseJSON(str); //parseJSON 用于从一个字符串中解析出json 对象
var man2 = JSON.parse(str); //parse 用于从一个字符串中解析出json 对象
console.log("$.parseJSON " + man1.name + man1.age); //张三23
console.log("JSON.parse " + man2.name + man2.age); //张三23 //删除元素数组中的重复元素
var arr = [1, 2, 3, 4, 4, 5, 5, 6];
$.unique(arr);
console.log(arr.join()); //返回 1,2,3,4,5,6 //$.extend() 合并对象中的元素 后面覆盖前面的
var result = $.extend({}, { name: "Tom", age: 21 }, { name: "Jerry", sex: "Boy" });
console.log(result.name); //输出 Jerry 后面的会覆盖前面的,result始终只是一个对象 //$.map() 改变函数内的数据,接受一个数组或类数组对象作为参数
var arr1 = [2, 5, 34, 22, 8];
var bbb = $.map(arr1, function (value, index) {
if (value > 5 && index < 3) { //值大于5 下标小于3
return value - 10;
}
})
console.log(arr1.join()); //2,5,34,22,8 可以看到原数组不改变
console.log(bbb.join()); //24 新数组只获得了操作之后的结果 /*
$.when 提供一种方法来执行一个或多个对象的回调函数,延迟对象通常表示异步事件。
when()函数常常和done()函数、fail()函数、then()函数联合使用:
done(Function func) - 当deferreds中的处理都完成的时候执行Function回调函数
fail(Function func) - 当deferreds中有一个处理失败的时候执行Function回调函数
then(Function func1,Function func2)- 结合了done和fail函数,
当都成功执行func1,当有一个失败执行func2
*/
var whenResult = $.when($.ajax("page1.php"), $.ajax("page2.php"));
whenResult.done(function (a1, a2) {
//函数内容略
//a1和a2俩参数是when函数中两个ajax请求的相关jqXHR对象
//var jqXHR = a1[2]; /* arguments are [ "success", statusText, jqXHR ] */
});
whenResult.fail(function () {
console.log("失败了")
//函数内容略
})
//whenResult.then(successFunc, failureFunc);
}) /*
$.isArray(obj) 检测参数是否是数组
$.isFunction(obj) 检测参数是否是一个函数
$.isEmptyObject(obj) 检测参数是否是一个空对象
$.isPlainObject(obj) 检测参数是否是一个纯粹对象,即对象是否通过{}或new Object()关键字创建。
$.contains(container,contained) 检测一个DOM节点是否包含另一个DOM节点。是则返回true否则表示false。
alert($.contains($("#div1")[0],$("#p1")[0])); //返回true,注意参数是DOM对象,并非jQuery对象
*/
</script>
</head>
<body>
<a id="myhref" href="http://www.baidu.com">去百度</a>
<div id="content">
外层div
<div id="msg">
内层div
</div>
</div>
</body>
</html>
Jquery字符串,数组(拷贝、删选、合并等),each循环,阻止冒泡,ajax出错,$.grep筛选,$.param序列化,$.when的更多相关文章
- jquery字符串数组转json字符串 C#json字符串转字符串list
一.jquery字符串数组转json字符串 var str=['1','2','3']; var jsonText= JSON.stringify(str);//把一个对象转换成json字符串 str ...
- java里如何实现循环打印出字符串或字符串数组里的内容
不多说,直接上干货! java里如何实现循环打印出字符串里的内容 思路:可以先将字符串转换成字符串数组. public class test { public static void main(Str ...
- String 字符串的追加,数组拷贝
package chengbaoDemo; import java.util.Arrays; /** *需求:数组的扩容以及数据的拷贝 *分析:因为String的实质是以字符数组存储的,所以字符串的追 ...
- jQuery对数组操作
//对象数组 var trackObj1={ , "direcLine":"line31" }; var currentTrack=[]; currentTra ...
- js与jquery常用数组方法总结
昨天被问数组方法的时候,问到sort()方法是否会改变原来的数组.本来我猜是不会,也是这么说,马上我又觉得,知识这种东西,不确定的时候直接说不确定或不知道就好,只是凭借着不确定的猜测或者是记忆,害人害 ...
- JS Jquery去除数组重复元素
js jquery去除数组中的重复元素 第一种:$.unique() 第二种: for(var i = 0,len = totalArray_line.length;i < len;i++) { ...
- IOS NS 字符串 数组 字典 文件 动态 静态 操作
ios 常用字符串的操作 //将NSData转化为NSString NSString* str = [[NSString alloc] initWithData:response e ...
- jQuery之数组处理函数
摘要:$.each,$.grep,$.map,$.merge,$.inArray,$.unique,$.makeArray 1. $.each(array, [callback]) 遍历[常用] 解释 ...
- JQuery对数组的一些操作总结
JQuery对数组的处理非常便捷并且功能强大齐全,一步到位的封装了很多原生js数组不能企及的功能.下面来看看JQuery数组的强大之处在哪. $.each(array, [callback]) 遍历 ...
随机推荐
- 第1阶段——u-boot分析之make指令(2)
通过make 100ask24x0_config 指令配置好芯片选型后,使用make指令来生成uboot.bin文件 本文学习目标: 对Makefile文件进行基本了解,掌握make指令是怎么实现生成 ...
- 数据库学习任务四:数据读取器对象SqlDataReader、数据适配器对象SqlDataAdapter、数据集对象DataSet
数据库应用程序的开发流程一般主要分为以下几个步骤: 创建数据库 使用Connection对象连接数据库 使用Command对象对数据源执行SQL命令并返回数据 使用DataReader和DataSet ...
- 从web图片裁剪出发:了解H5中的canvas
本篇内容不针对canvas文档对每个api进行逐个的详解! 本篇内容不针对canvas文档对每个api进行逐个的详解! 本篇内容不针对canvas文档对每个api进行逐个的详解! 重说三,好了,现在进 ...
- CCIE-MPLS VPN-实验手册(上卷)
看完了看完了看完了,豪爽豪爽豪爽,一个月了,写得挺棒.总共14个mpls vpn的实验,为留下学习的痕迹,原封不动献出. CCIE实验手册 (路由部分-MPLSVPN基础篇) [CCIE] JUST ...
- 团队作业8——第二次项目冲刺(Beta阶段)
Deadline: 2017-5-28 22:00PM,以博客发表日期为准 评分基准: 按时交 - 有分,检查的项目包括后文的三个个方面 冲刺计划安排(单独1篇博客) 七天的敏捷冲刺(每天发布1篇,共 ...
- 【Beta】 第六次Daily Scrum Meeting
一.本次会议为第六次meeting会议 二.时间:10:00AM-10:20AM 地点:禹州楼 三.会议站立式照片 四.今日任务安排 成员 昨日任务 今日任务 林晓芳 对目前完成的模块进行全面测试,并 ...
- Swing-JRadioButton用法-入门
JRadioButton是Swing中的单选框.所谓单选框是指,在同一个组内虽然有多个单选框存在,然而同一时刻只能有一个单选框处于选中状态.它就像收音机的按钮,按下一个时此前被按下的会自动弹起,故因此 ...
- 第6周-接口、内部类与Swing
1. 本周学习总结 1.1 面向对象学习暂告一段落,请使用思维导图,以封装.继承.多态为核心概念画一张思维导图,对面向对象思想进行一个总结. 注1:关键词与内容不求多,但概念之间的联系要清晰,内容覆盖 ...
- java第一次作业0
lsl321 java第一次作业 #1. 本章学习总结 你对于本章知识的学习总结 本章我们学习了各种java相关文件的使用,以及码云,博客,pat等程序辅助软件,这些对于我们专业的学习有非常大的帮助, ...
- java: Java中this和super的用法总结
this this是自身的一个对象,代表对象本身,可以理解为:指向对象本身的一个指针. this的用法在java中大体可以分为3种: 1.普通的直接引用 这种就不用讲了,this相当于是指向当前对象本 ...