使用JavaScript Regex查找包含特定文本的html注释的父节点

时间:2014-01-06 15:01:25

标签: javascript jquery html regex

我循环遍历数组并尝试查找包含与当前数组值匹配的特定文本的html注释标记的父html元素(tr& td)。

对于下面的示例,我将 myField 的值传递为 dev_LocationID ,但它始终返回null。在这个考试中,我试图匹配完整的字符串 FieldInternalName ='dev_LocationID'我知道文本在那里。我究竟做错了什么?任何帮助,将不胜感激!

myField = 'dev_LocationID';

function fnFindThisField(myField){
    var myFieldInternalName = "FieldInternalName='" +myField+ "'";  
    regexComment = new RegExp(/<!--\s*/myFieldInternalName\s*-->/g);
    targetElement = regexComment.test($('td').html());
    return targetElement;
}

html示例

<tr>
  <td><H3 ><nobr>Form Label</nobr></td>
  <td class="ms-formbody">  
     <!-- FieldName='Location ID'   FieldInternalName='dev_LocationID'  -->
    <select name="ctl00$dev_LocationID" id="ctl00_dev_LocationID">
    <option value="Please choose...">Please choose...</option>
    <option selected="selected" value="1">Location 1</option>
    <option selected="selected" value="1">Location 2</option>
  </select>
  </td>
</tr>

3 个答案:

答案 0 :(得分:1)

您没有注意匹配评论中的“FieldName ='位置ID'”部分,因此您的正则表达式不匹配。

另一方面,使用正则表达式处理html非常困难(有时是不可能的),请考虑使用解析器。

答案 1 :(得分:0)

试试这个:

myField = 'dev_LocationID';

function fnFindThisField(myField){
    var myFieldInternalName = "FieldInternalName='" +myField+ "'";  
    regexComment = new RegExp("/<!--.+?" + myFieldInternalName +"\s*-->"/g);
    targetElement = regexComment.test($('td').html());
    return targetElement;
}

您的代码不是合法的JavaScript代码。您要用于构建正则表达式的字符串变量不会像您认为的那样进行插值。在这里,我只是使用接受字符串的RegExp构造函数,并使用字符串连接手动构建模式。


请注意,使用正则表达式解析HTML可能是一个非常脆弱的解决方案。甚至不能使用Regex解析任意HTML,as others on StackOverflow have written about before

答案 2 :(得分:0)

最好的方法是实际遍历DOM树而不是正则表达式搜索其HTML字符串表示。

→ jsFiddle

function searchComments($dom) {
    var comments = [];

    $dom.contents().each(function (idx, node) {
        if (node.nodeType === Node.ELEMENT_NODE) {
            comments = comments.concat(searchComments($(node)));
        } else if (node.nodeType === Node.COMMENT_NODE) {
            comments.push(node);
        }
    });
    return comments;
}

function fnFindThisField(myField) {
    var myFieldInternalName = "FieldInternalName='" + myField + "'";
    var foundCommentNode = null;

    searchComments($(document.body)).every(function (commentNode) {
        if (commentNode.nodeValue.indexOf(myFieldInternalName) !== -1) {
            foundCommentNode = commentNode;
            return false;
        }
        return true;
    });
    return foundCommentNode;
}
console.log(fnFindThisField("dev_LocationID").parentNode);