使用正则表达式提取数据

时间:2014-10-21 20:44:35

标签: javascript jquery html regex

我有这些文字字段。

<input type="text" value="<p>aaaaaaaaaaa</p>" id="tab_4_0_li_div_content"><input type="text" value="lab" id="tab_4_0_li_data"><input type="text" value="<p>dddd</p>" id="tab_4_1_li_div_content"><input type="text" value="client" id="tab_4_1_li_data">

此处tab_4_*_li_data<li> html的标签,而tab_4_0_li_div_contentid的{​​{1}},会在<div>点击时显示。

现在我想使用正则表达式从这个输入字段中提取数据。例如

<li>

作为关键  和

client,lab 

作为密钥的值。

如果你发现这些是彼此相关的。

<p>aaaaaaaaaaa</p>,<p>dddd</p>
Div内容部分可以包含任何内容,它是一个文本区域。 那我们怎么做呢?

2 个答案:

答案 0 :(得分:0)

没有理由必须使用正则表达式来解析HTML。有一件事,你不会很开心。其次,使用DOM的力量

&#13;
&#13;
var contents = $("[id$=content]");  //find the elements that have an id that end with content
var datas = $("[id$=data]");   //find the elements that have an id that end with data
var details = {};  //object to hold results
datas.each( function(i) { details[datas[i].value] = contents[i].value; });  //start looping and generate the object with the details you are after
console.log(details);  //Object {lab: "<p>aaaaaaaaaaa</p>", client: "<p>dddd</p>"}
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input type="text" value="<p>aaaaaaaaaaa</p>" id="tab_4_0_li_div_content"><input type="text"   value="lab" id="tab_4_0_li_data"><input type="text" value="<p>dddd</p>" id="tab_4_1_li_div_content"><input type="text" value="client" id="tab_4_1_li_data">
&#13;
&#13;
&#13;

现在,代码假定数据和内容元素的顺序相同,如果不是,则需要稍微处理,但这并不难。

&#13;
&#13;
    var datas = $("[id$=data]");
    var details = {};
    datas.each(function(i, elem) {
      var id = elem.id;
      var val = $("#" + id.replace("data", "div_content")).val();
      details[elem.value] = val;
    }); 
    console.log(details); //Object {lab: "<p>aaaaaaaaaaa</p>", client: "<p>dddd</p>"}
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input type="text" value="<p>aaaaaaaaaaa</p>" id="tab_4_0_li_div_content">
<input type="text" value="lab" id="tab_4_0_li_data">
<input type="text" value="<p>dddd</p>" id="tab_4_1_li_div_content">
<input type="text" value="client" id="tab_4_1_li_data">
&#13;
&#13;
&#13;

答案 1 :(得分:0)

你可以这样做:

function getValuesById(id1,id2){
    var vals = {};
    if(id1 === undefined)
        id1 = "\\d+";
    if(id2 === undefined)
        id2 = "\\d+";

    $("input").each(function (index, value) {
        console.log(new RegExp('tab_(' + id1 + '_' + id2 + ')_li_data'));
        var match = value.id.match(new RegExp('tab_(' + id1 + '_' + id2 + ')_li_data'));
        if (match) {
            vals[value.value] = $("#tab_" + match[1] + "_li_div_content").val();
        }
    });
    return vals;
}

在这里,我搜索所有输入字段并与tab_DIGITS_DIGITS_li_div_data匹配,并将其作为键和对应的li_div_content作为对象值中的值。

请在此处查看:JSFiddle

更新:我已将代码更新为一个函数,您可以将参数发送到两个数值,如果没有提供,则使用任意数字,即用getValuesById(4)作为tab_4_*_li之类的值