jquery 添加自定义属性问题

[JasonZhou]

想在一个html元素里添加一个自定义属性，例如：

<div id="123" item=''></div>

item就是我给div自定义的属性，但是现在item属性只能是字符串数据。

我想让item属性存储数组类型数据，请问用jquery要怎么样实现？

下面是我在一个CMS里看到的代码：

<a class="current" id='_Menu_120' hidefocus='true' href="javascript:void(0)"><b>文章资讯</b></a> 

		  var arr = new Array();
		  arr = [];
		  arr.push([129,"文档编辑","Document/DocList.jsp","Icons/icon003a11.gif"]);
		  arr.push([303,"文档审核","Document/WorkList.jsp","Icons/icon003a11.gif"]);
		  arr.push([397,"文档回收站","Document/RecycleBin.jsp","Icons/icon003a11.gif"]);
		  arr.push([131,"个人备忘","Document/Notes.jsp","Icons/icon003a11.gif"]);
		  arr.push([132,"短消息","Document/Message.jsp","Icons/icon003a11.gif"]);
		  $("_Menu_120").ChildArray=arr;

ChildArray应该是它为a标签自定义的属性。不知道用jquery要怎么做？

[hch126163]

attr 保存的是字符串

var arr=[]; 是object 不是字符串
把object 转成字符串，再设置就没问题

arr = [];
arr.push([129,"文档编辑","Document/DocList.jsp","Icons/icon003a11.gif"]);
arr.push([303,"文档审核","Document/WorkList.jsp","Icons/icon003a11.gif"]);
arr.push([397,"文档回收站","Document/RecycleBin.jsp","Icons/icon003a11.gif"]);
arr.push([131,"个人备忘","Document/Notes.jsp","Icons/icon003a11.gif"]);
arr.push([132,"短消息","Document/Message.jsp","Icons/icon003a11.gif"]);
$("#_Menu_120").attr('ChildArray',JSON.serialize(arr));

下面是通用的Object转换成json的JS代码
//用法
//var obj=new Object();
//obj.Name= 'Nams ';
//obj.Sex=1;
//JSON.serialize(obj);//will get: {Name: 'Nams ',Sex:1}

if(typeof StringBuilder== 'undefined '){
StringBuilder=function(initialText)
{
var _parts = new Array();
if ((typeof(initialText) == 'string ')
&&(initialText.length != 0))
_parts.push(initialText);

this.append = function(text) {
if ((text == null) || (typeof(text) == 'undefined ')) {
return;
}
if ((typeof(text) == 'string ') && (text.length == 0)) {
return;
}
_parts.push(text);
}
this.appendLine = function(text) {
this.append(text);
_parts.push( '\r\n ');
}
this.clear = function() {
_parts.clear();
}
this.isEmpty = function() {
return (_parts.length == 0);
}
this.toString = function(delimiter) {
return _parts.join(delimiter || ' ');
}
}
}
JSON = new function() {

function serializeWithBuilder(object, stringBuilder) {
var i;

switch (typeof object) {
case 'object ':
if (object) {
if (object.join) {//if is array, you can using another method implement
stringBuilder.append( '[ ');
for (i = 0; i < object.length; ++i) {
if (i > 0) {
stringBuilder.append( ', ');
}
stringBuilder.append(serializeWithBuilder(object[i], stringBuilder));
}
stringBuilder.append( '] ');
}
else {
if (typeof object.serialize == 'function ') {
stringBuilder.append(object.serialize());
break;
}
stringBuilder.append( '{ ');
var needComma = false;
for (var name in object) {
if (name.startsWith( '$ ')) {
continue;
}
var value = object[name];
if (typeof value != 'undefined ' && typeof value != 'function ') {
if (needComma)
stringBuilder.append( ', ');
else
needComma = true;

stringBuilder.append(serializeWithBuilder(name, stringBuilder));
stringBuilder.append( ': ');
stringBuilder.append(serializeWithBuilder(value, stringBuilder));
}
}
stringBuilder.append( '} ');
}
}
else {
stringBuilder.append( 'null ');
}
break;

case 'number ':
if (isFinite(object)) {
stringBuilder.append(String(object));
}
else {
stringBuilder.append( 'null ');
}
break;

case 'string ':
stringBuilder.append( ' " ');
var length = object.length;
for (i = 0; i < length; ++i) {
var curChar = object.charAt(i);
if (curChar > = ' ') {
if (curChar == '\\ ' || curChar == ' " ') {
stringBuilder.append( '\\ ');
}
stringBuilder.append(curChar);
}
else {
switch (curChar) {
case '\b ':
stringBuilder.append( '\\b ');
break;
case '\f ':
stringBuilder.append( '\\f ');
break;
case '\n ':
stringBuilder.append( '\\n ');
break;
case '\r ':
stringBuilder.append( '\\r ');
break;
case '\t ':
stringBuilder.append( '\\t ');
break;
default:
stringBuilder.append( '\\u00 ');
stringBuilder.append(curChar.charCodeAt().toString(16));
}
}
}
stringBuilder.append( ' " ');
break;

case 'boolean ':
stringBuilder.append(object.toString());
break;

default:
stringBuilder.append( 'null ');
break;
}
}

this.serialize = function(object) {
var stringBuilder = new StringBuilder();
serializeWithBuilder(object, stringBuilder);
return stringBuilder.toString();
}

this.deserialize = function(data) {
return eval( '( ' + data + ') ');
}
}

本文来自CSDN博客，转载请标明出处：http://blog.csdn.net/lee576/archive/2008/04/06/2255091.aspx

[Acesidonu]

$('#_Menu_120').attr('ChildArray', arr.join(','));

[打字员]

set: $(selector).data('ChildArray', ['a', 1]);

get: $(selector).data('ChildArray');

[峭沙]

自定义属性为什么要体现在HTML上面呢？
用$('#123').data('item', {...}); // id不能以数字开头，自己修改吧
或者用纯js，var div = document.getElementById('123'); div.item = {...};

[峭沙]

[Quote=引用 9 楼 danica7773 的回复:]

set: $(selector).data('ChildArray', ['a', 1]);

get: $(selector).data('ChildArray');
[/Quote]自定义属性为什么要体现在HTML上面呢？
用$('#123').data('item', [1,2,3]); // id不能以数字开头，自己修改吧
取的时候用var arr = $('#123').data('item');

或者$('#123')[0].item = [1,2,3];
取值：var arr = $('#123')[0].item;
又或者用纯js，var div = document.getElementById('123'); div.item = [1,2,3];
取值： var arr = div.item;

[001007009]

<!DOCTYPE HTML>
<html>
	<head>
		<meta charset="gb2312" />
		<title></title>	
		<style>
		</style>		
		<script src="http://code.jquery.com/jquery-latest.js"></script>
	</head>
	<body>
		<div id="test" item="['a','b','c','d']"></div>
		<script>
			var s = $('#test').attr('item');
			s = eval('('+s+')');
			alert( s[0] )
		</script>
	</body>
</html>

楼主 这个意思？

[三石-gary]

$("_Menu_120").attr('ChildArray','arr')试试这样

[JasonZhou]

[Quote=引用 2 楼 zsx841021 的回复:]

$("_Menu_120").attr('ChildArray','arr')试试这样
[/Quote]
试过，没用

[JasonZhou]

[Quote=引用 1 楼 calmcrime 的回复:]

HTML code

<!DOCTYPE HTML>
<html>
<head>
<meta charset="gb2312" />
<title></title>
<style>
</style>
<script src="http://code.jquery.com/jquery……
[/Quote]

		  arr = [];
		  arr.push([129,"文档编辑","Document/DocList.jsp","Icons/icon003a11.gif"]);
		  arr.push([303,"文档审核","Document/WorkList.jsp","Icons/icon003a11.gif"]);
		  arr.push([397,"文档回收站","Document/RecycleBin.jsp","Icons/icon003a11.gif"]);
		  arr.push([131,"个人备忘","Document/Notes.jsp","Icons/icon003a11.gif"]);
		  arr.push([132,"短消息","Document/Message.jsp","Icons/icon003a11.gif"]);
		  $("#_Menu_120").attr('ChildArray',arr);

		  var c = $("#_Menu_120").attr('ChildArray');
		  var s = eval('('+c+')');
		  alert(s);

出错：
\u56FE\u7247\u5E93 is not defined
[在此错误处中断] var s = eval('('+c+')');

[001007009]

<!DOCTYPE HTML>
<html>
    <head>
        <meta charset="gb2312" />
        <title></title>    
        <style>
        </style>        
        <script src="http://code.jquery.com/jquery-latest.js"></script>
    </head>
    <body>
        <div id="test">123</div>
        <script>
          $("#test").attr('ChildArray','[[129,"文档编辑","Document/DocList.jsp","Icons/icon003a11.gif"],[303,"文档审核","Document/WorkList.jsp","Icons/icon003a11.gif"]]');
		  var c = $("#test").attr('ChildArray');
		  var s = eval('('+c+')');
          alert(s.length);
        </script>
    </body>
</html>

[JasonZhou]

[Quote=引用 5 楼 calmcrime 的回复:]

HTML code

<!DOCTYPE HTML>
<html>
<head>
<meta charset="gb2312" />
<title></title>
<style>
</style>
<script src="http://code.jquery.com/jquery……
[/Quote]

arr.push这种方式不行吗？

[吉普赛的歌]

[Quote=引用 9 楼 danica7773 的回复:]

set: $(selector).data('ChildArray', ['a', 1]);

get: $(selector).data('ChildArray');
[/Quote]

这个才是正道， 楼主明白了吧