当自定义数据属性为json格式字符串时jQuery的data api问题探讨

jQuery 的 data API 实现方式有缓存数据的效果
使用 IE 7 （IE8+ 在控制台切换至IE7 模式），当DOM 节点有自定义数据属性时，检查 DOM 节点即可看到 形如 jQuery18305664906559272507 的属性，这便是 用于从数据存储对象中获取自定义数据的建。

当自定义数据属性是一个 json 格式字符串时，缓存的数据如果被修改， 则修改后的数据继续存在于缓存系统中， 如果不留意，这可能导致一些BUG


代码如下:

<!DOCTYPE HTML>
<html>
<head>
<script src="http://code.jquery.com/jquery-1.8.3.js"></script>
</head>
<body>
<input type="hidden" value="" data-json='{"a":123,"b":456}' id="tst" />
<script>
var node = $("#tst");
console.log(node.attr("data-json"));
var data = node.data("json");
console.log(data);
data.b = 'hello';
var data1 = JSON.parse(node.attr("data-json"));
console.log(data1);
console.log('data===data1',data===data1);
var data2 = node.data("json");
console.log(data2);
console.log('data===data2',data===data2);
var data3 = JSON.parse(node.attr("data-json"));//这样取值不受缓存影响
console.log(data3);
</script>
</body>
</html>

运行结果


代码如下:

{"a":123,"b":456}
Object {a: 123, b: 456}
Object {a: 123, b: 456}
data===data1 false
Object {a: 123, b: "hello"}
data===data2 true
Object {a: 123, b: 456}

赞 (0)

相关推荐

  • JavaScript笔记之数据属性和存储器属性

    在javascript中,对象的属性分为数据属性和存储器属性两种: 两种属性的区别 我们使用Object.defineProperty()先来直观的感受一下这两者的不同. 使用Object.defineProperty()对数据属性进行设置的方法如下 var obj = {}; Object.defineProperty(obj, "prop", { value: 1, writable: true, //可写性 enumerable: true, //可枚举性 configurabl

  • Jsoup获取全国地区数据属性值（省市县镇村）

    Jsoup获取全国地区数据属性值（省市县镇村）

    jsoup 是一款Java 的HTML解析器,可直接解析某个URL地址.HTML文本内容.它提供了一套非常省力的API,可通过DOM,CSS以及类似于jQuery的操作方法来取出和操作数据. 最近手头在做一些东西,需要一个全国各地的地域数据,从省市区到县镇乡街道的.各种度娘,各种谷歌,都没找到一个完整的数据.最后功夫不负有心人,总算找到一份相对来说比较完整的数据,但是这里的数据也只是精确到镇级别,没有村一级的数据(后来通过分析数据源我知道了为什么,呵呵),在加上博主提供的有些数据存在冗余,对于有

  • 浅谈Javascript数据属性与访问器属性

    ES5中对象的属性可以分为'数据属性'和'访问器属性'两种. 数据属性一般用于存储数据数值,访问器属性对应的是set/get操作,不能直接存储数据值. 数据属性特性:value.writable.enumerable.configurable. 解释:configurable:true/false,是否可以通过delete删除属性,能否修改属性的特性,能否把属性修改为访问器属性,默认false: enumerable:true/false,是否可以通过for in循环返回,默认false: wr

  • 当自定义数据属性为json格式字符串时jQuery的data api问题探讨

    jQuery 的 data API 实现方式有缓存数据的效果 使用 IE 7 (IE8+ 在控制台切换至IE7 模式),当DOM 节点有自定义数据属性时,检查 DOM 节点即可看到 形如 jQuery18305664906559272507 的属性,这便是 用于从数据存储对象中获取自定义数据的建. 当自定义数据属性是一个 json 格式字符串时,缓存的数据如果被修改, 则修改后的数据继续存在于缓存系统中, 如果不留意,这可能导致一些BUG 复制代码 代码如下: <!DOCTYPE HTML>

  • Python日志:自定义输出字段 json格式输出方式

    最近有一个需求:将日志以json格式输出, 并且有些字段是logging模块没有的.看了很多源码和资料, 终于搞定, 抽取精华分享出来, 一起成长. import json import logging class JsonFilter(logging.Filter): ip = 'IP' source = 'APP' def filter(self, record): record.ip = self.ip record.username = self.source return True i

  • JS中的数组转变成JSON格式字符串的方法

    有一个JS数组,如: var arr = [["projectname1","projectnumber1"],["projectname2","projectnumber2"],["projectname3","projectnumber3"]]; 想将此数组转换成JSON字符串,如: var jsonarr = [{"projectname":projectnam

  • C#实现将类的内容写成JSON格式字符串的方法

    C#实现将类的内容写成JSON格式字符串的方法

    本文实例讲述了C#实现将类的内容写成JSON格式字符串的方法.分享给大家供大家参考.具体如下: 本例中建立了Person类,赋值后将类中内容写入到字符串中 运行本代码需要添加引用动态库Newtonsoft.Json 程序代码: using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.Threading.Tasks; //需要引用 Newtonsoft.Js

  • 使用JavaScript构建JSON格式字符串实现步骤

    如果你现在正在使用Restful API,并且你需要通过web项目来构建json格式字符串的响应,那么这篇文章将帮助你使用javascript来创建json格式字符串.这是非常有用的,我们将通过jQuery插件$.toJSON把数据对象转换为json格式. 使用JavaScript构建JSON格式字符串 JavaScript代码: 在这里包含了javascript代码.$("#form").submit(function(){}- delete_button是form标签的ID,我们通

  • 详解JavaScript中js对象与JSON格式字符串的相互转换

    详解JavaScript中js对象与JSON格式字符串的相互转换

    首先我们来看一下js中JSON格式的字符串 var JSONStr1 = "{\"name\" : \"张三\"}"; 注意以下的写法不是js中JSON格式的字符串,它只是一个js的字符串. var JSONStr2 = "{'name' : '张三'}"; 我们看JSON语法中对于字符串的定义:是由双引号包围的任意数量Unicode字符的集合,使用反斜线转义.一个字符(character)即一个单独的字符串(characte

  • FastJson对于JSON格式字符串、JSON对象及JavaBean之间的相互转换操作

    FastJson对于JSON格式字符串、JSON对象及JavaBean之间的相互转换操作

    fastJson对于json格式字符串的解析主要用到了一下三个类: JSON:fastJson的解析器,用于JSON格式字符串与JSON对象及javaBean之间的转换. JSONObject:fastJson提供的json对象. JSONArray:fastJson提供json数组对象. 我们可以把JSONObject当成一个Map<String,Object>来看,只是JSONObject提供了更为丰富便捷的方法,方便我们对于对象属性的操作.我们看一下源码. 同样我们可以把JSONArra

  • PHP基于CURL发送JSON格式字符串的方法示例

    本文实例讲述了PHP基于CURL发送JSON格式字符串的方法.分享给大家供大家参考,具体如下: /* * post 发送JSON 格式数据 * @param $url string URL * @param $data_string string 请求的具体内容 * @return array * code 状态码 * result 返回结果 */ function post_json_data($url, $data_string) { $ch = curl_init(); curl_seto

  • JS实现将二维数组转为json格式字符串操作示例

    本文实例讲述了JS实现将二维数组转为json格式字符串操作.分享给大家供大家参考,具体如下: <!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>json</title> <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js

  • Java Servlet生成JSON格式数据并用jQuery显示的方法

    本文实例讲述了Java Servlet生成JSON格式数据并用jQuery显示的方法.分享给大家供大家参考,具体如下: 1.Servlet通过json-lib生成JSON格式的数据 import java.io.IOException; import java.io.PrintWriter; import java.util.*; import javax.servlet.ServletException; import javax.servlet.annotation.WebServlet;

随机推荐