WebView2 - преобразование HTML-тела в коллекцию с использованием JSON

Ну, @David Risney очень хорошо объясняет, почему вы не можете сериализовать HTMLCollection (что возвращает свойство rows) в JSON.

Вместо этого вы можете написать функцию javascript, которая возвращает двумерный массив, который будет автоматически сериализован в JSON и легко десериализован обратно в двумерный массив на C #.

Я предполагаю, что вы хотите прочитать текст всех ячеек как массив.

Вот такая функция:

var TableContent = function (tableId)
{
    let array = [];

    /** @type {NodeListOf<HTMLTableRowElement>} */
    let rows = document.querySelectorAll('#' + tableId + ' > tbody > tr');

    rows.forEach(function (row, i, rows)
    {
        array[i] = [];
        Array.from(row.cells).forEach(function (cell, j, cells)
        {
            array[i][j] = cell.textContent;
        });
    });
    return array;
};

(Вы знаете, как вставить javascript в WebView2).

Теперь в C # получить массив довольно просто:

string tableId = "GridView1";
string json = await webView21.ExecuteScriptAsync("TableContent('" + tableId + "')");
string[][] cellsContent = Newtonsoft.Json.JsonConvert.DeserializeObject<string[][]>(json);

Теперь у вас есть двухмерный строковый массив со всем текстом ячеек.

Вы можете получить к нему доступ так:

cellsContent[rowIndex][cellIndex]

ExecuteScriptAsync сериализует результат выполнения скрипта в JSON с помощью JSON.stringify. В браузере, если вы перейдете на страницу с таблицей вроде https://developer.mozilla.org/en-US/docs/Web/HTML/Element/table, затем откройте DevTools и запустите следующее, вы увидите тот же результат:

JSON.stringify(document.getElementById("perfCardTable").rows)

"{\"0\":{},\"1\":{},\"2\":{},\"3\":{},\"4\":{}}"

Проблема в том, что JSON.stringify сериализует только свойства hasOwnProperty непосредственно в объекте, а не свойства, прототипически унаследованные от его родительского объекта. Практически каждый объект DOM наследует все свои свойства от родительского объекта, поэтому вы увидите {} как результат JSON.stringify любого объекта DOM.

Чтобы обойти это, вы можете скопировать нужные вам свойства прямо в новый объект.

JSON.stringify(Array.from(document.getElementById("perfCardTable").rows).map(row => { 
    let copy = {};
    for (let name in row) {
        copy[name] = row[name];
    }
    return copy;
}));

Результат этого очень большой, и в нем только свойства в строке, а не свойства этих свойств, поэтому вы, вероятно, захотите выбрать определенные свойства, которые вас интересуют, а не копировать все.

Между прочим, если JSON.stringify сериализует все унаследованные свойства, он будет выдан, если вы предоставите ему объект DOM строки таблицы, потому что у него есть свойство ownerDocument. OwnerDocument - это содержащий документ, который позволяет вам получить его дочерние элементы и, в конечном итоге, вернуться к элементу DOM строки таблицы, который является циклической ссылкой, не разрешенной JSON.stringify.