最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - Get content between comments - Stack Overflow

programmeradmin2浏览0评论

Hopefully not too tricky this one...

I am trying to get just the context between the <!-- itemtemplate --> ments using javascript (with the jQuery plugin). The result must exclude the ments though. In this case the parent is a table, but it can be anything such as a div

Table

<table id="lvList" class="grid1">
    <tr>
        <th>Name </th>
        <th>Number </th>
        <th>Type </th>
        <th>Account Manager </th>
    </tr>
    <!-- itemtemplate -->
    <tr>
        <td><boundfield output="hyperlink" datafield="name" dataurlfields="id" dataurlformat="details/?id={0}" /></td>
        <td><boundfield output="string" datafield="id" /></td>
        <td><boundfield output="string" datafield="type" /></td>
        <td><boundfield output="string" datafield="accmgr" /></td>
    </tr>
    <!-- itemtemplate -->
</table>

Div

<div id="lvList">
  <!-- itemtemplate -->
     something something something
     <boundfield output="string" datafield="id" />
  <!-- itemtemplate -->
</div>

Thanks to Felix for the idea

function GetTemplate(root, name) {
    var output = "";
    var record = false;
    function iterate(node) {
        var children = node.childNodes;
        for (var i = 0; i < children.length; i++) {
            var child = children[i];
            if (child.nodeType === 3 && child.nodeValue.trim() === "") continue;

            if (child.nodeType === 8 && child.nodeValue.trim() === name) {
                if (!record) { record = true; continue; }
                else { break; }
            }

            if (record)
                output += outerHTML(child);
            else {
                if (child.hasChildNodes)
                    iterate(child);
            }
        }
    }
    iterate(root);
    return output;
};
function ClearTemplate (root, name) {
    var record = false;
    function iterate(node) {
        var children = node.childNodes;
        for (var i = children.length - 1; i >= 0; i--) {
            var child = children[i];
            if (child.nodeType === 8 && child.nodeValue.trim() === name) {
                if (!record) { record = true; continue; }
                else { break; }
            }
            if (record)
                node.removeChild(child);
            else {
                if (child.hasChildNodes)
                    iterate(child);
            }
        }
    }
    iterate(root);
};
function InsertInto (root, name, items) {
    function iterate(node) {
        var children = node.childNodes;
        for (var i = 0; i < children.length; i++) {
            var child = children[i];
            if (child.nodeType === 3 && child.nodeValue.trim() === "") continue;
            if (child.nodeType === 8 && child.nodeValue.trim() === name) {
                for (var n = items.length - 1; n >= 0; n--)
                    child.parentNode.insertBefore(items[n], child.nextSibling);
                break;
            }
            if (child.hasChildNodes)
                iterate(child);
        }
    }
    iterate(root);
};
String.prototype.trim = function () {
    return this.replace(/^(\s|&nbsp;|\u00A0)+|(\s|&nbsp;|\u00A0)+$/g, "");
};
function outerHTML(node) {
    return node.outerHTML || 
            (function (n) {
                var div = document.createElement('div');
                div.appendChild(n.cloneNode(true));
                return div.innerHTML;
            })(node);
};

Hopefully not too tricky this one...

I am trying to get just the context between the <!-- itemtemplate --> ments using javascript (with the jQuery plugin). The result must exclude the ments though. In this case the parent is a table, but it can be anything such as a div

Table

<table id="lvList" class="grid1">
    <tr>
        <th>Name </th>
        <th>Number </th>
        <th>Type </th>
        <th>Account Manager </th>
    </tr>
    <!-- itemtemplate -->
    <tr>
        <td><boundfield output="hyperlink" datafield="name" dataurlfields="id" dataurlformat="details/?id={0}" /></td>
        <td><boundfield output="string" datafield="id" /></td>
        <td><boundfield output="string" datafield="type" /></td>
        <td><boundfield output="string" datafield="accmgr" /></td>
    </tr>
    <!-- itemtemplate -->
</table>

Div

<div id="lvList">
  <!-- itemtemplate -->
     something something something
     <boundfield output="string" datafield="id" />
  <!-- itemtemplate -->
</div>

Thanks to Felix for the idea

function GetTemplate(root, name) {
    var output = "";
    var record = false;
    function iterate(node) {
        var children = node.childNodes;
        for (var i = 0; i < children.length; i++) {
            var child = children[i];
            if (child.nodeType === 3 && child.nodeValue.trim() === "") continue;

            if (child.nodeType === 8 && child.nodeValue.trim() === name) {
                if (!record) { record = true; continue; }
                else { break; }
            }

            if (record)
                output += outerHTML(child);
            else {
                if (child.hasChildNodes)
                    iterate(child);
            }
        }
    }
    iterate(root);
    return output;
};
function ClearTemplate (root, name) {
    var record = false;
    function iterate(node) {
        var children = node.childNodes;
        for (var i = children.length - 1; i >= 0; i--) {
            var child = children[i];
            if (child.nodeType === 8 && child.nodeValue.trim() === name) {
                if (!record) { record = true; continue; }
                else { break; }
            }
            if (record)
                node.removeChild(child);
            else {
                if (child.hasChildNodes)
                    iterate(child);
            }
        }
    }
    iterate(root);
};
function InsertInto (root, name, items) {
    function iterate(node) {
        var children = node.childNodes;
        for (var i = 0; i < children.length; i++) {
            var child = children[i];
            if (child.nodeType === 3 && child.nodeValue.trim() === "") continue;
            if (child.nodeType === 8 && child.nodeValue.trim() === name) {
                for (var n = items.length - 1; n >= 0; n--)
                    child.parentNode.insertBefore(items[n], child.nextSibling);
                break;
            }
            if (child.hasChildNodes)
                iterate(child);
        }
    }
    iterate(root);
};
String.prototype.trim = function () {
    return this.replace(/^(\s|&nbsp;|\u00A0)+|(\s|&nbsp;|\u00A0)+$/g, "");
};
function outerHTML(node) {
    return node.outerHTML || 
            (function (n) {
                var div = document.createElement('div');
                div.appendChild(n.cloneNode(true));
                return div.innerHTML;
            })(node);
};
Share Improve this question edited Sep 29, 2011 at 19:19 Christian asked Sep 29, 2011 at 8:44 ChristianChristian 3,9823 gold badges43 silver badges61 bronze badges 7
  • 1 why don't you use jQuery.tmpl() plugin? – Robert Koritnik Commented Sep 29, 2011 at 8:47
  • is it always the second TR that you're trying to get? – Robert Koritnik Commented Sep 29, 2011 at 8:47
  • This looks like a terrible home-brew of a template language. If you can, you should use jQuery Template or something similar. – Asbjørn Ulsberg Commented Sep 29, 2011 at 8:48
  • @Robert will look into tmpl now but no, not always the 2nd tr – Christian Commented Sep 29, 2011 at 8:48
  • How do you get this content: it's a DOM element's or string or response of xmlhttprequest? – Andrew D. Commented Sep 29, 2011 at 8:53
 |  Show 2 more ments

3 Answers 3

Reset to default 6

Neither regex nor jQuery: The idea is to iterate over all child nodes and check whether the node is a ment node and if yes, whether it contains a certain string, e.g. itemtemplate.

function extract(node, needle) {
    var children = node.childNodes,
        record = false,
        container = document.createDocumentFragment();

    for(var i = 0, l = children.length; i < l; i++) {
        var child = children[i];

        if(child.nodeType === 8 && child.nodeValue === needle) {
            record = !record;
            continue;
        }   

        if(record) {
            container.appendChild(child.cloneNode(true));
        }       
    }
    return container;
}

Usage:

var nodes = extract(someParent, ' itemtemplate ');

DEMO

I don't know whether this is the best solution for you situation, you don't give any information about the context.

Parsing XML data (as HTML is a type of) using regular expressions is bound to fail. I suggest you use a tool specifically designed for parsing XML. In javascript, DOMParser can be used for this.

Link to w3schools for using this.

You can try this

var result = '<div id="lvList"><!-- itemtemplate -->something something 
something<boundfield output="string" datafield="id" /><!-- itemtemplate --></div>'
.split(/<!--\s*itemtemplate\s*-->/)

result[1] will have the desired text you want.

发布评论

评论列表(0)

  1. 暂无评论