3

httprequest 経由で js ファイルをロードし、結果のテキストから特定の文字列 (この場合はコメント) を解析しようとしていますが、正規表現に問題があります。

function SampleTest() {
    this.test1 = function() {
        /* :DOM <div id="sampleDIV">You loaded the sample div</div> */
    };
    this.test2 = function() {
        /* :DOM <div>Second Div Loaded</div> */          
    }
}

別のスクリプトには、次の機能があります。

var getElementFromComment = function(obj) {

    function getHTML(method) {
        var httpRequest = new XMLHttpRequest();
        httpRequest.open('GET', 'SampleTest.js', false);
        httpRequest.send();
        var response = httpRequest.responseText;

        var re = new RegExp(method); //Not sure how to implement the regex
        var result = response.match(re);
        console.log(result);
    }

    for(var method in obj) {
        getHTML(method);
    }
}

var sampleTest = new SampleTest();
getElementFromComment(sampleTest);

最終結果は、渡された関数名に基づいて、SampleTest のそのコメントから HTML を抽出する必要があります。私の場合、すべての関数をループし、それぞれの html 文字列を次々に取得します。適切なアプローチは次のようになると思います。

  1. httprequest 経由で Javascript ファイルを取得 - 既に完了
  2. getHTML に渡された名前と一致する SampleTest 内の関数を見つけ、正規表現を介して関数全体を文字列として返します。
  3. 別の正規表現を使用して、関数文字列内から /* :DOM で始まり */ で終わる文字列を抽出します。簡単にするために 1 行しか使用していませんが、これは複数行のコメントにすることができます。
  4. そして最後に、* や :DOM などのすべてのゴミを html 文字列に置き換えます。

ファイルには複数の関数が含まれている可能性が高く、それぞれに独自のコメントがあるため、コメントをすぐにファイルで検索することはできません。これをすべてコンテキストに入れると、JavaScript 単体テスト用の HTML をその場でロードできるようにしたいので、これを行っています。この関数は最終的に単体テスト オブジェクト内のすべての関数をループし、HTML を取得して読み込み、関数を実行し、HTML を削除して、次の関数に移動します。

更新 受け入れられた回答ポスターからのすべての助けのおかげで、すべてを機能させることができました。ただし、純粋な HTML 文字列を取得できるように、複数行のコメントのサポートを追加したり、事後にすべての不要な文字を置き換えたりするなど、いくつかの調整を行う必要がありました。私の更新されたコードは以下のとおりです。

function getHTML(method, str) {
        var commentMatch;
        var re = new RegExp(method+'\\s*=\\s*function[^}]+\\*/'); //Not sure how to implement the regex
        var fnMatch = str.match(re);
        if(fnMatch) {
            var fnEx = new RegExp('\/\*\s*:[^\s]+\s*(.*?|\n)\*\/', 'g');
            commentMatch = fnMatch[0].match(fnEx);
            var result = commentMatch[0].replace(/(\s*:DOM\s*)|(\*\/)|(\/\*)|(\*)/gm, '');
            result = result.replace(/^\s*/gm, '');
            if(commentMatch) {
                return result;
            }
        }
    }
4

1 に答える 1

1

JavaScript 文字列変数の JavaScript コードからコメント文字列を抽出する場合は、次のようにします。

var str = "function SampleTest() { \
    this.test = function() { \
        /* :DOM <div id=\"sampleDIV\">You loaded the sample div</div> */ \
    }; \
}";

var matches = str.match(/\/\*\s*:DOM\s*(.*?)\*\//);
if (matches) {
    alert(matches[1]);
}​

ここでの動作デモ: http://jsfiddle.net/jfriend00/hWCwA/

":DOM" の部分が常に同じではない場合は、次のように少し異なるバージョンを使用できます。

var str = "function SampleTest() { \
    this.test = function() { \
        /* :DOM <div id=\"sampleDIV\">You loaded the sample div</div> */ \
    }; \
}";

var matches = str.match(/\/\*\s*:[^\s]+\s*(.*?)\*\//);
if (matches) {
    alert(matches[1]);
}​

ここでの動作デモ: http://jsfiddle.net/jfriend00/qpF3k/

OK、あなたのコメントに基づいて、ここに別のショットがあります。これにより、関数名の後の次のコメントが検索されます。最初の関数を見るのをやめる}ので、この関数にコメントがない場合は次の関数に入る必要はありません。

function findComment(funcName, str) {
    var commentMatch;
    var re = new RegExp("this\\." + funcName + "\\s*=\\s*function[^}]+\\*/");
    var funcMatch = str.match(re);
    if (funcMatch) {
        commentMatch = funcMatch[0].match(/\/\*\s*:[^\s]+\s*(.*?)\*\//);
        if (commentMatch) {
            return(commentMatch[1]);
        }
    }
    return null;
}
于 2012-04-06T17:52:38.253 に答える