Question

＆＃39; tab_text＆＃39;是一个从'mytable＆＃39;重新生成的HTML代码。通过此代码。我想要的是这个重新生成的html具有输入值而不是输入文本字段。它将用于一些提取任务。为此，我找到了一些代码片段，并试图为了我的利益编辑它：

var tab_text="<table border='2px'><tr bgcolor='#87AFC6'>";
var j=0;
mytable = document.getElementById('countersTable'); // id of table

    for(j = 0 ; j < mytable.rows.length ; j++)
    {
        tab_text=tab_text+mytable.rows[j].innerHTML+"</tr>";
    }

    tab_text=tab_text+"</table>";

    tab_text= tab_text.replace(/<input[^>]*>|<\/input>/gi, "")

显然，我需要在最后一行添加一个正则表达式而不是""。我试过input[type=text][id^=*]它没用。

请你帮我找一个解决这个问题的方法吗？

Answer 1

这里不要使用正则表达式，使用DOM方法要简单得多。在您的情况下，replaceChild会运作良好。

首先，您需要选择所有输入字段。然后迭代集合，最后用其值替换每个集合。

var inputs = document.querySelectorAll('input');

for (var i = 0; i < inputs.length; i++) {
    var text = document.createTextNode(inputs[i].value);
    inputs[i].parentNode.replaceChild(text, inputs[i]);
}

<div>
    Some <input type="text" value="Thomas" />
</div>
<p>One more <input type="text" value="Field" /></p>

在上面的演示中，所有input字段都将被替换。当然，如果需要，可以在querySelectorAll中扩展CSS选择器以处理其他表单元素：input, textarea, select。

<强> UPD 即可。这就是如何将上述解决方案与您的代码结合起来以获得表格的文本表示，并将输入转换为文本：

var tab_text = "<table border='2px'><tr bgcolor='#87AFC6'>";
var j = 0;
var mytable = document.getElementById('countersTable'); // id of table

for (j = 0; j < mytable.rows.length; j++) {

    var rowClone = mytable.rows[j].cloneNode(true),
        inputs = rowClone.querySelectorAll('input');

    for (var i = 0; i < inputs.length; i++) {
        var text = document.createTextNode(inputs[i].value);
        inputs[i].parentNode.replaceChild(text, inputs[i]);
    }

    tab_text = tab_text + rowClone.innerHTML + "</tr>";
}

tab_text = tab_text + "</table>";

演示： http://jsfiddle.net/hn7Lakx6/

用html替换html中的输入文本字段

1 个答案: