我们如何在 react-native 中将 HTML 文件/元素转换为 JSON 格式答案

【问题标题】：How can we convert HTML file / elements to JSON format in react-native我们如何在 react-native 中将 HTML 文件/元素转换为 JSON 格式
【发布时间】：2018-09-24 11:54:06
【问题描述】：

在 react-native 中开发示例应用程序，我得到了 html 格式的响应。如何在 react-native 中将 html 响应转换为 JSON 格式。

这正是我在回复中得到的内容

"content": "<!doctype html>\r\n<html>\r\n<head>\r\n<style>\r\n#ac-wrapper {\r\n    position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(255,255,255,.6); z-index: 1001;\r\n}\r\n.region{\r\n    color: #fff; font-weight: bold; text-transform: capitalize;\r\n}\r\n.city{\r\n    color: #fff;\r\n}\r\n.no-margin{\r\n    margin:0px;\r\n}\r\n#popup{\r\n    width: 555px; height: 230px; background: #0B6390; border: 1px solid #0B6390; box-shadow: #64686e 0px 0px 3px 3px;\r\n    -moz-box-shadow: #64686e 0px 0px 3px 3px; -webkit-box-shadow: #64686e 0px 0px 3px 3px; position: relative; top: 150px;\r\n}\r\n.button, .button:hover{\r\n    width:100%; background:#fff; color:#000 !important; font-weight: bold;\r\n}\r\n</style>\r\n</head>\r\n\r\n<body>\r\n<center>\r\n<div id=\"ac-wrapper\">\r\n  <div id=\"popup\">\r\n    <h2 class=\"region\">Select Your Region</h2>\r\n    </br>\r\n    <h3 class=\"city\" >Choose Your Nearest City</h3>\r\n    <br>\r\n      <div class=\"col-sm-6\">\r\n          <a href=\"{{store url=\"\"}}vizag\" target=\"_blank\">\r\n              <button class=\"button\">Visakhapatnam</button>\r\n           </a>             \r\n     </div>\r\n      <div class=\"col-sm-6\">\r\n          <a href=\"{{store url=\"\"}}hyd\" target=\"_blank\">\r\n              <button class=\"button\">Hyderabad</button>\r\n           </a>             \r\n     </div>\r\n  </div>\r\n</div>\r\n</center>\r\n\r\n<script type=\"text/javascript\">\r\nfunction PopUp(){\r\n        document.getElementById('ac-wrapper').style.display=\"none\"; \r\n}\r\n</script>\r\n</body>\r\n\r\n</html>"

【问题讨论】：

您需要解析 HTML，从中提取您关心的数据（我不知道那是什么类型的数据，将其表示为一行 JavaScript 编码的 HTML它或多或少不可读），将其放入 JavaScript 数据结构中，然后将其字符串化为 JSON。其中很大一部分要么是“太宽泛”，要么是 stackoverflow 问题，要么是“不清楚”你想要输出的确切内容。
你能给我样品吗？如果我使用解析它还没有工作
没有。请参阅我关于“过于宽泛”的说明。
"如果我使用解析它还不能工作"...什么样的解析？显然 JSON.parse 将不起作用，因为数据不是 JSON。您需要一些能够解析 HTML 并允许您轻松遍历它并从中获取信息的东西。例如，jQuery 可以做到这一点。如果您搜索，我相信还有很多其他选择。然后，一旦您可以从 HTML 中提取所需的位，就可以将其制成 JS 对象，然后您可以将其字符串化以使其成为 JSON。这些是您需要完成的步骤。所有这些都可以单独研究，并且已经在网上找到了示例。
请做一些基础研究并尝试一下。这不是免费的“做我的研究”、“写我的代码”甚至“做我的想法”的服务。我们给自己的空闲时间，作为回报，我们希望至少有一些证据表明您自己的时间已经被首先花费。我们将帮助您解决您的问题，而不是为您解决问题。如果您需要某人代表您完成所有工作，您需要付钱给某人（不是我们）。从您目前的声誉得分来看，我希望您现在已经很好地了解了该网站的运作方式。

标签： html json react-native

【解决方案1】：

你可以使用这个库：https://github.com/andrejewski/himalaya

import {parse} from 'himalaya'
const html = '<html/>' //your html goes here
const json = parse(html)
console.log(json)

【讨论】：