繁体   English   中英

html5lib dart。 通过类选择器查询抛出异常

[英]html5lib dart. Query by class-selector throw exception

我正在尝试通过选择器.nav获取具有nav类的元素。 结果lib抛出异常:

仅实现类型选择器。

代码示例:

import 'package:html5lib/parser.dart';

void main() {
  String html = '''
    <html>
    <head><title>Some title</title></head>
    <body>
    <div class="nav">Some nav content</div>
    </body>
    </html>
  ''';
  var doc = parse(html);

  print(doc.query('.nav'));
}

控制台输出:

Breaking on exception: UnimplementedError: only type selectors are implemented
Unhandled exception:
UnimplementedError: only type selectors are implemented
#0      Node._typeSelector (package:html5lib/dom.dart:269:7)
#1      Node.query (package:html5lib/dom.dart:249:62)
#2      main (/home/hello/dart/test/bin/simple_exp.dart:14:18)
#3      _startIsolate.isolateStartHandler (dart:isolate-patch/isolate_patch.dart:190)
#4      _RawReceivePortImpl._handleMessage (dart:isolate-patch/isolate_patch.dart:93)

怎么了?

尚未实现完全的CSS选择器匹配。

根据您的用例,您可能可以匹配类型(标签名称),然后使用Element的class属性过滤结果。

这是如何执行此操作的示例:

  var el = doc.queryAll('div').where((el) => 
      el.attributes.keys.contains('class') &&
        el.attributes['class'].split(' ').contains('nav')).first;

希望有人会很快实现查询选择器匹配支持-因为这种解决方法对于带有很多div标签的文档来说效率很低。

另一个解决方案是自己遍历-像这样:

queryClass(Node element, String className) {
  for (var node in element.nodes) {
    if (node is! Element) continue;
    if (node.attributes.keys.contains('class') 
        && node.attributes['class'].split(' ').contains(className)) {
      return node;
    }
    var result = queryClass(node, className);
    if (result != null) return result;
  }
  return null;
}

main() {
   var doc = parse(...);
   var el = queryClass(doc, 'nav');
   print(el);
}

查看html5lib解析器的代码,您可以看到查询功能仅适用于类型选择器(例如:div,head等)。 源代码中有一条注释说明,并且抛出的异常非常明显。

可能的情况下,一种解决方案是使用queryAll方法返回所有div并对其进行迭代,直到找到具有相应类的一个或多个。 我知道到目前为止,这并不是理想的解决方案,但它可能会起作用。

希望能帮助到你!

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM