jQuery 字符串 和 JSON 相互转换

2024-09-05 02:38

本文主要是介绍jQuery 字符串 和 JSON 相互转换,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

在提交数据时,可能因为接口的原因,需要将JSON数据序列化为字符串,或者将字符串转为JOSN对象。

首先聊一天将JSON数据序列化为字符串

emmmm....小编这次没有骚操作。经查阅jQuery的API后,jQuery 已经有封装好的方法 $.param( obj ) 

$.param( obj ) ,功能描述:一个用来序列化的一个数组,一个普通的对象,或一个jQuery对象。

经小编测试后,序列化一个数组全是 undefined ,可能是小编姿势不对。下面主要演示对象序列化

var author = {name: 'helang', email: 'helang.love@qq.com'};
var str1=$.param(author);
console.log(str1);   // name=helang&email=helang.love%40qq.com

通过 $.param( obj ) 方法成功的序列化成字符串,但是有个"不能算是坑的坑",那就是字符串中的 "@" 被 encodeURIComponent 函数编码了,需要重新解码才能正确显示。

console.log(decodeURIComponent(str1));  //  name=helang&email=helang.love@qq.com

通过 decodeURIComponent 函数解码后成功“绕坑”。

接下来说一说将字符串转为JOSN对象

先封装一个 jQuery 的类级别插件扩展,保证在代码的调用上代码风格的统一

$.extend({/* 解析为JSON */"parseJSON":function (str) {var strArr=str.split("&");var searchJSON={};$.each(strArr,function (index,item) {var item=item.split("=");searchJSON[item[0]]=decodeURIComponent(item[1]);});return searchJSON;}
});

调用方法:

var json1=$.parseJSON(str1);
console.log(json1);    //{name: "helang", email: "helang.love@qq.com"}

一波完美的操作后,本篇文章的内容就在这里结束了。文章的高潮一般都在结尾部分,所以请在复制代码时,注意示例代码中变量的顺序。别忘了持续关注我,么么哒!

作者:黄河爱浪 QQ:1846492969,邮箱:helang.love@qq.com

微信公众号:web-7258,本文原创,著作权归作者所有,转载请注明原链接及出处。

更多精彩文章,请扫下方二维码关注我的公众号

这篇关于jQuery 字符串 和 JSON 相互转换的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/1137738

相关文章

Java controller接口出入参时间序列化转换操作方法(两种)

《Javacontroller接口出入参时间序列化转换操作方法(两种)》:本文主要介绍Javacontroller接口出入参时间序列化转换操作方法,本文给大家列举两种简单方法,感兴趣的朋友一起看... 目录方式一、使用注解方式二、统一配置场景:在controller编写的接口,在前后端交互过程中一般都会涉及

Java中的StringBuilder之如何高效构建字符串

《Java中的StringBuilder之如何高效构建字符串》本文将深入浅出地介绍StringBuilder的使用方法、性能优势以及相关字符串处理技术,结合代码示例帮助读者更好地理解和应用,希望对大家... 目录关键点什么是 StringBuilder?为什么需要 StringBuilder?如何使用 St

MySQL 中的 JSON 查询案例详解

《MySQL中的JSON查询案例详解》:本文主要介绍MySQL的JSON查询的相关知识,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧... 目录mysql 的 jsON 路径格式基本结构路径组件详解特殊语法元素实际示例简单路径复杂路径简写操作符注意MySQL 的 J

Spring Boot中JSON数值溢出问题从报错到优雅解决办法

《SpringBoot中JSON数值溢出问题从报错到优雅解决办法》:本文主要介绍SpringBoot中JSON数值溢出问题从报错到优雅的解决办法,通过修改字段类型为Long、添加全局异常处理和... 目录一、问题背景:为什么我的接口突然报错了?二、为什么会发生这个错误?1. Java 数据类型的“容量”限制

Java对象转换的实现方式汇总

《Java对象转换的实现方式汇总》:本文主要介绍Java对象转换的多种实现方式,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧... 目录Java对象转换的多种实现方式1. 手动映射(Manual Mapping)2. Builder模式3. 工具类辅助映

Java中字符串转时间与时间转字符串的操作详解

《Java中字符串转时间与时间转字符串的操作详解》Java的java.time包提供了强大的日期和时间处理功能,通过DateTimeFormatter可以轻松地在日期时间对象和字符串之间进行转换,下面... 目录一、字符串转时间(一)使用预定义格式(二)自定义格式二、时间转字符串(一)使用预定义格式(二)自

Spring 请求之传递 JSON 数据的操作方法

《Spring请求之传递JSON数据的操作方法》JSON就是一种数据格式,有自己的格式和语法,使用文本表示一个对象或数组的信息,因此JSON本质是字符串,主要负责在不同的语言中数据传递和交换,这... 目录jsON 概念JSON 语法JSON 的语法JSON 的两种结构JSON 字符串和 Java 对象互转

python实现svg图片转换为png和gif

《python实现svg图片转换为png和gif》这篇文章主要为大家详细介绍了python如何实现将svg图片格式转换为png和gif,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下... 目录python实现svg图片转换为png和gifpython实现图片格式之间的相互转换延展:基于Py

HTML5中的Microdata与历史记录管理详解

《HTML5中的Microdata与历史记录管理详解》Microdata作为HTML5新增的一个特性,它允许开发者在HTML文档中添加更多的语义信息,以便于搜索引擎和浏览器更好地理解页面内容,本文将探... 目录html5中的Mijscrodata与历史记录管理背景简介html5中的Microdata使用M

html5的响应式布局的方法示例详解

《html5的响应式布局的方法示例详解》:本文主要介绍了HTML5中使用媒体查询和Flexbox进行响应式布局的方法,简要介绍了CSSGrid布局的基础知识和如何实现自动换行的网格布局,详细内容请阅读本文,希望能对你有所帮助... 一 使用媒体查询响应式布局        使用的参数@media这是常用的