zoukankan      html  css  js  c++  java
  • jquery.metadata.js使用分析

    <!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>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title></title>
        <script type="text/javascript" src="/js/jquery.js"></script>
        <script type="text/javascript" src="/js/jquery.metadata.js"></script>
        <script type="text/javascript">
            $(document).ready(function () {
                //default is class
                alert($(".media").metadata().src);
                alert($('li.someclass').metadata().some);
                var data = $('li.someclass').metadata();
                if (data.some && data.some == 'data')
                    alert('It Worked!');
    
                //setType usage
                $.metadata.setType("attr", "data");
                alert($("#li2").metadata().json);
    
                $.metadata.setType("elem", "script");
                alert($("#li3").metadata().data);
    
                //reset to default class
                $.metadata.setType("class");
                //single usage
                var data2 = $("#li4").metadata({ single: "jdata" });
                alert($("#li4").data("jdata").name);
    
                //get usage
                var data3 = $.metadata.get(document.getElementById("li5"));
                alert(data3.key);
            });
        </script>
    </head>
    
    <body>
        <object class="media {src:'/tems/upload/192168.mp3'}" data="[object Object]"></object>
        <ul>
            <li class="someclass {some: 'data'} anotherclass">...</li>
            <li id="li2" data="{some:'random', json: 'data...here'}">...</li>
            <li id="li3">
                <script type="data">{some:"json",data:true}</script>
            </li>
            <li id="li4" class="{name:'zhang',age:34} otherclass">.....</li>
            <li id="li5" class="{key:'china',value:'beijing'}"></li>
        </ul>
    </body>
    </html>
  • 相关阅读:
    Mysql 三大特性详解
    MySQL Innodb日志机制深入分析
    Bootstrap学习地址
    Java【锁】
    Java【tomcat】配置文件
    nginx配置文件详解【nginx.conf】
    Sqlserver2008[索引]
    网络知识
    RestClient火狐接口测试地址
    java基础1JDK各大版本下载地址
  • 原文地址:https://www.cnblogs.com/AndyGe/p/4119540.html
Copyright © 2011-2022 走看看