jQuery给标签添加自定义属性

    jQuery给标签添加自定义属性
    下面代码包含了添加和获取自定义属性。
    添加的属性值有数字，类数组，对象，详细用法见备注。
    

<script type="text/javascript">
        // 设置属性
        $('#box').css('width', '200px')
        $('#a1').attr('href',"http://www.baidu.com")
        // 设置多个属性
        // 注意：属性名不用加引号
        $('#a1').attr({ href: "http://t.tt", target: "_blank" })


        // *********** 添加和获取自定义属性 ************
        // ==========1.设置一个自定义值==========
        $('#a1').attr('myIndex',2)
        console.log($('#a1').attr('myIndex'))

        // ==========2.设置多个自定义值==========
        // 注意：属性名要加引号，不能使用阿拉伯数字作为属性名
        fruitsList = {'a':'苹果', 'b':'香蕉', 'c':'西瓜'}

        // !!!!!!!!!!! 不正确的设置 !!!!!!!!!!!
        $('#a1').attr('fruit',fruitsList)
        console.log($('#a1').attr('fruit'))   // 打印：[object Object]，没有实际用处

        // 正确设置和获取属性
        $('#a1').attr(fruitsList)
        console.log($('#a1').attr('a'))         // 打印: 苹果
        console.log($('#a1').attr('b'))         // 打印: 香蕉
        console.log($('#a1').attr('c'))         // 打印: 西瓜

        // ==========3.设置自定义值为对象===========
        // 创建对象
        function Person(name, age){
            this.name = name
            this.age = age
        }
        person1 = new Person('Lili', 20)

        // !!!!!!!!!!! 不正确的设置 !!!!!!!!!!!
        $('#a1').attr('myattar', person1)       
        console.log($('#a1').attr('myattar'))   // 打印：[object Object]，没有实际用处

        // 正确设置和获取属性
        $('#a1').attr(person1)
        console.log($('#a1').attr('name'))
        console.log($('#a1').attr('age'))
    </script>