Как получить свойства CSS из проанализированного HTML-элемента, используя AngleSharp

Question

Имея этот CSS:

.foo { background-size: 10px 20px; }

И этот HTML:

<span class="foo"></span>

И это C#:

var parser = new HtmlParser();
var doc = parser.Parse("http://localhost/test.html");
var element = doc.QuerySelector("span.foo");

Как получить связанную ширину фона и высоту для элемента?

(В настоящее время я использую AngleSharp версии 0.9.9)

Answer 1

Прежде всего, код C# неверен. Строка, которую вы передаете parser.Parse это HTML-код, а не URI. Также ваш код не выполняет синтаксический анализ CSS - он использует только синтаксический анализатор HTML. Таким образом, давайте использовать контекст просмотра, чтобы получить все, что вам нужно.

var config = Configuration.Default.WithDefaultLoader().WithCss();
var context = BrowsingContext.New(config);
var document = context.OpenAsync("http://localhost/test.html").Result;
var element = document.QuerySelector("span.foo");
var style = document.DefaultView.GetComputedStyle(element);
var size = style.BackgroundSize;

Имейте в виду, что element может быть нулевым, если такого элемента не существует (ни один не соответствует запросу) и что GetComputedStyle Метод работает только ограниченным образом. Также, если ваш CSS определен во внешней таблице стилей, обязательно активируйте загрузку ресурсов.

Надеюсь это поможет!