javascript - 无法过滤类似数组的对象
问题描述
我想检索[image]
HTML 中的标签,因此我使用DOMParser
将字符串解析为对象。._filter
但是,当Lodash使用时,我无法获取图像数组。
奇怪的是,我在使用._find
.
我在网上搜索了解决方案,但找不到与我的案例相关的内容,请赐教。谢谢你。
const content = '<!DOCTYPE html><html><head><meta name="keywords" content="seo, search engine optimisation, search engine optimization, search engine ranking"><meta name="description" content="A pages description, usually one or two sentences."/><title>Page title 123</title><link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css"></head><body><h1>Hello there</h1><p><img src="https://fallbacks.carbonads.com/nosvn/fallbacks/731050e6bd3fc6979e1cb1a972294dae.png" class="fr-fic fr-dii"></p><a href="domain.com">This is domain</a><a href="domain.com2">This is domain2</a></body></html>';
let parser = new DOMParser(),
parsedHtml = parser.parseFromString(content, 'text/html'),
tagsInHtml = parsedHtml.all;
// ## Filter the data
let hrefArray = _.filter(tagsInHtml, { "tagName": "A" }), // ??? Empty [] array
hrefArray2 = _.find(tagsInHtml, { "tagName": "A" }), // This working;
附有JSFiddle
解决方案
您需要将您的标签集合转换为Array
第一个:
const content = '<!DOCTYPE html><html><head><meta name="keywords" content="seo, search engine optimisation, search engine optimization, search engine ranking"><meta name="description" content="A pages description, usually one or two sentences."/><title>Page title 123</title><link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css"></head><body><h1>Hello there</h1><p><img src="https://fallbacks.carbonads.com/nosvn/fallbacks/731050e6bd3fc6979e1cb1a972294dae.png" class="fr-fic fr-dii"></p><a href="domain.com">This is domain</a><a href="domain.com2">This is domain2</a></body></html>';
let parser = new DOMParser(),
parsedHtml = parser.parseFromString(content, 'text/html'),
tagsInHtml = parsedHtml.all,
tags = Array.from(tagsInHtml);
// Filter the data
let hrefArray = _.filter(tags, { 'tagName': 'A' }),
hrefArray2 = _.find(tags, { 'tagName': 'A' });
console.dir(hrefArray);
console.dir(hrefArray2);
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.15/lodash.min.js"></script>
推荐阅读
- angular - 可以停用 | observable 保持其初始值
- r - data.table 循环遍历列名
- go - golang 错误消息因版本而异?
- docker - Kubernetes Pod 中的多容器 ASP.NET Core 应用程序提供已在使用中的错误地址
- c++ - 使用 Malloc 为 STL 列表分配内存?
- python - 尝试使用 Python 替换 html 标记时擦除以下标记
- python - 为什么即使我更改了文件,Tensorflow 也没有属性“gfile”?
- javascript - Cheerio 使用离子创建 API
- excel - Excel VBA 比较列
- reactjs - 如何在 nextjs 中显示来自 api 的图像