Skip to content
Convert HTML to JSON.
C#
Branch: master
Clone or download
Latest commit edb5c76 Dec 6, 2017

Files

Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
src Fix Test. Mar 3, 2017
.gitattributes Add .gitignore and .gitattributes. Oct 1, 2016
.gitignore Add .gitignore and .gitattributes. Oct 1, 2016
JackWFinlay.Jsonize.sln change character from lower- to uppercase Oct 8, 2016
README.md Update README.md Dec 6, 2017
global.json simplify projects array Oct 8, 2016
license.md Create license.md Oct 6, 2016

README.md

Jsonize

Convert HTML to JSON. Currently available for .NET Framework 4.6, .NET Standard Library 1.6, and .NET Core 1.0. May be compatible with lower versions, any help porting backwards would be great.

Version 2.0.0

Check out the jsonize-2.0.0 branch to see the latest updates.

Try it

Try it out: http://jsonize.jackfinlay.com

Get the NuGet package: https://www.nuget.org/packages/JackWFinlay.Jsonize/

Usage

Use the using statement:

using JackWFinlay.Jsonize;

An example to get the site "http://jackfinlay.com" as a JSON string:

private static async Task<string> Testy(string q = "")
{
    using (var client = new HttpClient())
    {
        string url = @"http://jackfinlay.com";

        HttpResponseMessage response = await client.GetAsync(url);

        string html = await response.Content.ReadAsStringAsync();
        Jsonize jsonize = new Jsonize(html);

        return jsonize.ParseHtmlAsJsonString();
    }
}

Alternatively, get the response as a Newtonsoft.Json JObject:

return jsonize.ParseHtmlAsJson();

You can control the output with a JsonizeConfiguration object, which is passed as a parameter to the parsing methods:

...
JsonizeConfiguration jsonizeConfiguration = new JsonizeConfiguration
{
    NullValueHandling = NullValueHandling.Ignore,
    EmptyTextNodeHandling = EmptyTextNodeHandling.Ignore,
    TextTrimHandling = TextTrimHandling.Trim,
    ClassAttributeHandling = ClassAttributeHandling.Array
};

return jsonize.ParseHtmlAsJsonString(jsonizeConfiguration);

Results are in the form:

{
    "node":"Node type e.g. Document, Element, or Comment",
    "tag":"If node is Element this will display the tag e.g p, h1 ,div etc.",
    "text":"If node is of type Text, this will display the text in that node.",
    "attr":{
                "name":"value",
                "name":"value",
                "class": []
            },
    "child":[
                {
                    "node":"Node type e.g. Document, Element, or Comment",
                    "tag":"If node is Element this will display the tag e.g p, h1 ,div etc.",
                    "text":"If node is of type Text, this will display the text in that node.",
                    "child": []
                },
                ...
            ]

Example:

<!DOCTYPE html>
<html>
    <head>
        <title>Jsonize</title>
    </head>
    <body>
        <div id="parent" class="parent-div">
            <div id="child1" class="child-div child1">Some Text</div>
            <div id="child2" class="child-div child2">Some Text</div>
            <div id="child3" class="child-div child3">Some Text</div>
        </div>
    </body>
</html>

Becomes:

{
  "node": "Document",
  "child": [
    {
      "node": "Comment",
      "text": "<!DOCTYPE html>"
    },
    {
      "node": "Element",
      "tag": "html",
      "child": [
        {
          "node": "Element",
          "tag": "head",
          "child": [
            {
              "node": "Element",
              "tag": "title",
              "child": [
                {
                  "node": "Text",
                  "text": "Jsonize"
                }
              ]
            }
          ]
        },
        {
          "node": "Element",
          "tag": "body",
          "child": [
            {
              "node": "Element",
              "tag": "div",
              "attr": {
                "id": "parent",
                "class": [
                  "parent-div"
                ]
              },
              "child": [
                {
                  "node": "Element",
                  "tag": "div",
                  "attr": {
                    "id": "child1",
                    "class": [
                      "child-div",
                      "child1"
                    ]
                  },
                  "child": [
                    {
                      "node": "Text",
                      "text": "Some Text"
                    }
                  ]
                },
                {
                  "node": "Element",
                  "tag": "div",
                  "attr": {
                    "id": "child2",
                    "class": [
                      "child-div",
                      "child2"
                    ]
                  },
                  "child": [
                    {
                      "node": "Text",
                      "text": "Some Text"
                    }
                  ]
                },
                {
                  "node": "Element",
                  "tag": "div",
                  "attr": {
                    "id": "child3",
                    "class": [
                      "child-div",
                      "child3"
                    ]
                  },
                  "child": [
                    {
                      "node": "Text",
                      "text": "Some Text"
                    }
                  ]
                }
              ]
            }
          ]
        }
      ]
    }
  ]
}

TODO:

  • Port to .Net 4.6. Fixed in 1.0.5
  • Remove formatting issues such as empty child arrays on Script tags with no content. Fixed in 1.0.3
  • Change class attribute to array rather than space separated. Fixed in 1.0.2
  • Add support to directly pass in a URL.
  • Add Documentation.

License

MIT

See license.md for details.

You can’t perform that action at this time.