在ajax响应中从html获取输入值答案

【问题标题】：get input value from html in ajax response在ajax响应中从html获取输入值
【发布时间】：2015-12-22 01:42:33
【问题描述】：

为了获取页面的html响应，我使用：

var theUrl = "https://example.com/users/22";
var xmlHttp = new XMLHttpRequest();
xmlHttp.open( "GET", theUrl, false );
xmlHttp.send();
var html = xmlHttp.responseText;

这将返回一个 535 行的 html 页面。如果我们只是在当前页面上拥有该源代码，则获取标签的值（12345）如下所示：

<input name="token" type="hidden" value="12345" />

我们会简单地使用：

document.getElementsByName("token")[0].value;

但是由于 HTML 在 ajax 响应中作为一个名为 html 的变量，我如何使用名称令牌获取输入的值？我可以以某种方式将其转换为 DOM 元素，然后运行该代码吗？请只使用javascript，不要使用jQuery。谢谢。

【问题讨论】：

这个答案可能会帮助你解决你的问题：stackoverflow.com/questions/9598791/…

标签： javascript html ajax response

【解决方案1】：

尝试创建一个 HTML 元素，添加响应，然后解析它。我们需要添加一个类名来使用getElementsByClassName选择特定的输入，或者，如果你想选择所有的输入，你可以使用getElementsByTagName

var responseText = '<input name="token" class="token" type="hidden" value="12345" />'
var el = document.createElement( 'html' );
el.innerHTML = responseText;
console.log(el.getElementsByClassName("token")[0].value);

【讨论】：

Getting: Uncaught TypeError: el.getElementsByName is not a function.
看起来您只能在文档上调用 getElmentsByName。我们可以在响应中调用 getElemetnsByClassName

【解决方案2】：

你可以像这样解析你的 xmltHttp.response 文本：

 var xmlString = "<input name='token1' type='hidden' value='12345' />"; // Use your xmlHttp.responseText here. This is for demonstration purposes
 var parser = new DOMParser();
 var element = parser.parseFromString(xmlString, "text/html");
 console.log(element.querySelectorAll('[name="token1"]')[0].value);

【讨论】：