test.html

<h2>before comments</h2>
<div id="comments">Loading...</div>
<h3>after comments</h3>

<script type="text/javascript" src="/assets/jquery-1.6.2.min.js"></script>
<script type="text/javascript" class="juvia">
(function() {
    var options = {
        container    : '#comments',
        site_key     : '9vdtj58u4j4ir74b1bkkbqhlxhcn7l0',
        topic_key    : 'test',
        topic_url    : location.href,
        topic_title  : document.title || location.href,
        comment_order: 'latest-first'
    };

    function makeQueryString(options) {
        var key, params = [];
        for (key in options) {
            params.push(
                encodeURIComponent(key) +
                '=' +
                encodeURIComponent(options[key]));
        }
        return params.join('&');
    }

    function makeApiUrl(options) {
        // Makes sure that each call generates a unique URL, otherwise
        // the browser may not actually perform the request.
        if (!('_juviaRequestCounter' in window)) {
            window._juviaRequestCounter = 0;
        }

        var result =
            'http://0.0.0.0:3000/api/show_topic.js' +
            '?_c=' + window._juviaRequestCounter +
            '&' + makeQueryString(options);
        window._juviaRequestCounter++;
        return result;
    }
    
    var s       = document.createElement('script');
    s.async     = true;
    s.type      = 'text/javascript';
    s.className = 'juvia';
    s.src       = makeApiUrl(options);
    (document.getElementsByTagName('head')[0] ||
     document.getElementsByTagName('body')[0]).appendChild(s);
})();
</script>