标签云 - jqcloud 用法

最新推荐文章于 2024-07-12 16:42:46 发布

weixin_34068198

最新推荐文章于 2024-07-12 16:42:46 发布

阅读量155

点赞数

文章标签： json javascript ViewUI

原文链接：http://www.cnblogs.com/ibgo/p/5320255.html

版权

html

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <link rel="stylesheet" type="text/css" href="jqcloud.css" />
    <link rel="stylesheet" type="text/css" href="cloud.css"/>
</head>

<body>
    <h1>web-html</h1>
    <p id="elenum"></p>
    <div id="words"></div>
    <h2>h2</h2>
    <script src="scripts/jquery-2.2.2.js"></script>
    <script src="scripts/jqcloud-1.0.4.js"></script>
    <script src="scripts/cloud.js"></script>
</body>

</html>

var word_list = [
       { text: "Lorem", weight: 13, link: "https://github.com/DukeLeNoir/jQCloud" },
       { text: "Ipsum", weight: 10.5, html: { title: "My Title", "class": "custom-class" }, link: { href: "http://jquery.com/", target: "_blank" } },
       { text: "Dolor", weight: 9.4 },
       // ... 
];

$(function() {
       //$("#my_favorite_latin_words").jQCloud(word_list);

       // how many elements on this page
       var e = $('*').get();
       console.log(e.length);

       // tag name array
       var arr = []
       $.each($('*'), function() {
        //var myname = this.tagName; // HTML
        var myname = this.localName; // html
        if ($.inArray(myname, arr) < 0) {
            arr.push(myname);
        }
       });
       $('#elenum').text("Elements number: " + arr.length);
       console.log("unique:", arr, "lenght:", arr.length);

       // convert to json
       var newarr = [];
       for (i = 0; i < arr.length; i++) {
        var num = $(arr[i]).length;
        var data = {};
        data['text'] = arr[i];
        data['weight'] = num;
        newarr.push(data);

        console.log('tag:' + arr[i], "num:" + num);
       }
       console.log(JSON.stringify(newarr));

       // replace ""
       var rep = JSON.stringify(newarr)
        .replace(/\"text"/g, "text")
        .replace(/\"weight"/g, "weight");

       console.log("->", rep);

       $("#words").jQCloud(newarr, {
        width: 300,
        height: 200
    });
});

https://github.com/lucaong/jQCloud

转载于:https://www.cnblogs.com/ibgo/p/5320255.html

weixin_34068198

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
标签云 - jqcloud 用法

html<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <link rel="stylesheet" type="text/css" ...
复制链接

扫一扫