在javaScript中通过DOM获取tagNames而不依赖于其他元素

Question

假设我有这个，

var sampleString = "<username>user1</username><password>userpassword</password><age>21</age><sex>male</sex>";

我正在通过 DOM 解析器传递它以 html 形式填充数据。我以此为参考。http://xmljs.sourceforge.net/website/sampleApplications-w3cdom.html

但是在这个 DOM 解析器中

docRef.txtFirstName.value = trim(user.getElementsByTagName("FIRSTNAME").item(0).getFirstChild().getNodeValue(),true, true);

编辑 ：在访问上述代码之前将其转换为 DOM。 它通过逐个获取与 tagNames 相关的值来填充 html 形式的数据，但我需要一个静态方法，可用于填充不同的表单，例如逐个获取 tagNames 和值。

他们通过标签名称获取元素，并通过各自的ID填写表单。但是我的应用程序中有很多表格。我认为为每个表单编辑上述代码并不是一个好的选择。我在 web 中搜索以获取标签名称，但它们都是指从元素等获取标签名称。我找不到与从 javascript 中的 var 获取标签名称相关的任何内容。是否可以从 var 中获取 tagName（当然它是最终过程中的 DOM）？

Answer 1

你可以利用jQuery的基元函数，然后解析它。 jQuery函数接受一个格式良好的html字符串并返回一个jQuery对象，该对象具有filter。

传递给filter的参数可以是 css 选择器。

var sampleString = "<username>user1</username><password>userpassword</password><age>21</age><sex>male</sex>";
$(sampleString).filter('username').text(); // user1

在jQuery中有很多方法可以跨越DOM，如closest，find，parent，filter等等。只需应用您需要的内容。

Answer 2

我不会使用$.parseHTML(sampleString)或$(sampleString)来解析无效的html数据。结果可能未在 html 的未来版本中定义。

相反，我会确保您的sampleString是有效的 xml 结构（根中只有一个元素）：

var sampleString = "<info><username>user1</username><password>userpassword</password><age>21</age><sex>male</sex></info>";

并使用jQuery.parseXML（）解析它。你可以对这个结果使用普通的jQuery DOM遍历。

var doc = $( jQuery.parseXML(sampleString) );
doc.find('username').text();

用 html5 中新增的 html 标记来说明问题。假设您希望将信息源添加到数据中，您可以将<source>用作标记。

var sampleString = '<username>user1</username><password>userpassword</password><age>21</age><sex>male</sex><source>form somewhere</source>';

如果您使用$.parseHTML(sampleString)或$(sampleString)将导致：

[<username>user1</username>, <password>userpassword</password>, <age>21</age><sex>male</sex>, <source>, "from somewhere"]

如您所见，"from somewhere"不再是<source>的一部分。