jQuery提取元数据Metadata插件

最新推荐文章于 2016-01-16 16:40:00 发布

原创最新推荐文章于 2016-01-16 16:40:00 发布 · 330 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #ViewUI

jquery 专栏收录该内容

51 篇文章

订阅专栏

本文介绍了 jQuery Metadata 插件的使用方法，该插件能够从DOM对象中提取元数据，包括类名、随机属性、子元素及HTML5 data-* 属性等。文章通过实例演示了如何使用该插件来获取不同类型的元数据。

jQuery.metadata是用来从dom对象提取元数据，即取到一个元素对象的相关属性

This plugin is capable of extracting metadata from classes, random attributes, child elements and HTML5 data-* attributes.官方网址：

API网址：

http://docs.jquery.com/Plugins/Metadata

代码：

    <li id="Li1" class='someclass {"item_id": 1, "item_label": "Label"}'>Item 1</li>
    <li id="Li2" metadata='{"item_id": 1, "item_label": "Label"}'>Item 2</li>
    <li id="Li3">
        <metadata style="display: none;">{"item_id": 1, "item_label": "Label"}</metadata>
        Item 3 </li>
    <li id="Li4">
        <script type="metadata">{"item_id": 1, "item_label": "Label"}</script>
        Item 4 </li>

    $(function() {
        $("#item1").metadata().item_id; // 1
        $("#item1").metadata({
            "type": "class"
        }).item_id; // 1 

        $("#item2").metadata({
            "type": "attr"
        }).item_label; // "Label"
        $("#item2").metadata({
            "type": "attr",
            "name": "metadata"
        }).item_label; // "Label" 

        $("#item3").metadata({
            "type": "elem"
        }).item_label; // "Label"
        $("#item3").metadata({
            "type": "elem",
            "name": "metadata"
        }).item_label; // "Label" 

        $("#item4").metadata({
            "type": "elem",
            "name": "script"
        }).item_label; // "Label"
    });