dom 相关问题

通过文档对象模型，将此标记用于有关其他语言与XML / HTML交互的问题。不要将其用作HTML，JavaScript或SAX的简写 - 使用其他标记来表示语言和标记。

为什么调用`URL.revokeObjectURL`方法会有40秒的延迟？

FileSaver.js源代码#L106 a.href = URL.createObjectURL(blob) setTimeout(function () { URL.revokeObjectURL(a.href) }, 4E4) // 40s setTimeout(函数() { 点击(a) }, 0) 为什么会有40秒...

javascript dom

回答 1 投票 0

如何抓取相关图像

如果我查看亚马逊按钮将商品添加到其网站上的列表中 - 您可以在这里看到它： http://www.amazon.co.uk/wishlist/get-button 它是如何工作的？我很确定它会以某种方式刮擦页面，但...

javascript html parsing web-scraping dom

回答 1 投票 0

从具有指定类的所有元素中获取文本作为平面数组

我知道我们可以使用 PHP DOM 来使用 PHP 解析 HTML，但我有一个特定的要求。我有如下 HTML 内容我知道我们可以使用 PHP DOM 来使用 PHP 解析 HTML，但我有一个特定的要求。我有如下所示的 HTML 内容 <p class="Heading1-P"> <span class="Heading1-H">Chapter 1</span> </p> <p class="Normal-P"> <span class="Normal-H">This is chapter 1</span> </p> <p class="Heading1-P"> <span class="Heading1-H">Chapter 2</span> </p> <p class="Normal-P"> <span class="Normal-H">This is chapter 2</span> </p> <p class="Heading1-P"> <span class="Heading1-H">Chapter 3</span> </p> <p class="Normal-P"> <span class="Normal-H">This is chapter 3</span> </p> 我想解析上面的 HTML 并将内容保存到两个不同的数组中，例如： $heading 和 $content $heading = array('Chapter 1', 'Chapter 2', 'Chapter 3'); $content = array('This is chapter 1', 'This is chapter 2', 'This is chapter 3'); 我可以简单地使用 jQuery 来实现这一点。但我不确定这是否是正确的方法。我已经使用 DOMDocument 和 DOMXPath 来获得解决方案： $test = <<< HTML <p class="Heading1-P"> <span class="Heading1-H">Chapter 1</span> </p> <p class="Normal-P"> <span class="Normal-H">This is chapter 1</span> </p> <p class="Heading1-P"> <span class="Heading1-H">Chapter 2</span> </p> <p class="Normal-P"> <span class="Normal-H">This is chapter 2</span> </p> <p class="Heading1-P"> <span class="Heading1-H">Chapter 3</span> </p> <p class="Normal-P"> <span class="Normal-H">This is chapter 3</span> </p> HTML; $dom = new DOMDocument(); $dom->loadHTML($test); $xpath = new DOMXPath($dom); $heading = parseToArray($xpath,'Heading1-H'); $content = parseToArray($xpath,'Normal-H'); var_dump($heading); echo "<br/>"; var_dump($content); echo "<br/>"; function parseToArray(DOMXPath $xpath, string $class): array { $xpathquery = "//*[@class='$class']"; $elements = $xpath->query($xpathquery); $resultarray = []; foreach ($elements as $element) { $nodes = $element->childNodes; foreach ($nodes as $node) { $resultarray[] = $node->nodeValue; } } return $resultarray; } 尝试查看 PHP 简单 HTML DOM 解析器它具有类似于 jQuery 的出色语法，因此您可以轻松地通过 ID 或类选择任何您想要的元素 // include/require the simple html dom parser file $html_string = ' <p class="Heading1-P"> <span class="Heading1-H">Chapter 1</span> </p> <p class="Normal-P"> <span class="Normal-H">This is chapter 1</span> </p> <p class="Heading1-P"> <span class="Heading1-H">Chapter 2</span> </p> <p class="Normal-P"> <span class="Normal-H">This is chapter 2</span> </p> <p class="Heading1-P"> <span class="Heading1-H">Chapter 3</span> </p> <p class="Normal-P"> <span class="Normal-H">This is chapter 3</span> </p>'; $html = str_get_html($html_string); foreach($html->find('span') as $element) { if ($element->class === 'Heading1-H') { $heading[] = $element->innertext; }else if($element->class === 'Normal-H') { $content[] = $element->innertext; } } 这是使用 DiDOM 解析 html 的另一种方法。 composer require imangazaliev/didom <?php use DiDom\Document; require_once('vendor/autoload.php'); $html = <<<HTML <p class="Heading1-P"> <span class="Heading1-H">Chapter 1</span> </p> <p class="Normal-P"> <span class="Normal-H">This is chapter 1</span> </p> <p class="Heading1-P"> <span class="Heading1-H">Chapter 2</span> </p> <p class="Normal-P"> <span class="Normal-H">This is chapter 2</span> </p> <p class="Heading1-P"> <span class="Heading1-H">Chapter 3</span> </p> <p class="Normal-P"> <span class="Normal-H">This is chapter 3</span> </p> HTML; $document = new Document($html); // find chapter headings $elements = $document->find('.Heading1-H'); $headings = []; foreach ($elements as $element) { $headings[] = $element->text(); } // find chapter texts $elements = $document->find('.Normal-H'); $chapters = []; foreach ($elements as $element) { $chapters[] = $element->text(); } echo("Headings\n"); foreach ($headings as $heading) { echo("- {$heading}\n"); } echo("Chapter texts\n"); foreach ($chapters as $chapter) { echo("- {$chapter}\n"); } 您的一个选择是使用 DOMDocument 和 DOMXPath。它们确实需要一些曲线来学习，但是一旦你这样做了，你就会对你所取得的成就感到非常满意。在 php.net 中阅读以下内容 http://php.net/manual/en/class.domdocument.php http://php.net/manual/en/class.domxpath.php 希望这有帮助。这是 @saji89 答案的功能风格等效。在任何级别上搜索具有所需类的任何元素（如果可能有多个类分配给一个元素，请使用 contains()），然后使用 text() 定位节点文本。将 XPath 对象转换为数组后，只需隔离 nodeValue 列即可。代码：（演示） $dom = new DOMDocument(); $dom->loadHTML($html); $xpath = new DOMXPath($dom); foreach (['Heading1-H', 'Normal-H'] as $class) { var_export( array_column( iterator_to_array($xpath->query("//*[@class='$class']/text()")), 'nodeValue' ) ); echo "\n---\n"; } 输出： array ( 0 => 'Chapter 1', 1 => 'Chapter 2', 2 => 'Chapter 3', ) --- array ( 0 => 'This is chapter 1', 1 => 'This is chapter 2', 2 => 'This is chapter 3', ) --- // 从 URL 或文件创建 DOM $html = file_get_html('http://www.google.com/'); // 查找所有图像 foreach($html->find('img') as $element) echo $element->src . '<br>'; // 查找所有链接 foreach($html->find('a') as $element) echo $element->href . '<br>';

php html dom html-parsing text-extraction

回答 6 投票 0

如何在PHP中解析HTML？

我知道我们可以使用 PHP DOM 来使用 PHP 解析 HTML。我也在 Stack Overflow 上发现了很多问题。但我有一个具体的要求。我有如下 HTML 内容我知道我们可以使用 PHP DOM 来使用 PHP 解析 HTML。我也在 Stack Overflow 上发现了很多问题。但我有一个具体的要求。我有如下 HTML 内容 <p class="Heading1-P"> <span class="Heading1-H">Chapter 1</span> </p> <p class="Normal-P"> <span class="Normal-H">This is chapter 1</span> </p> <p class="Heading1-P"> <span class="Heading1-H">Chapter 2</span> </p> <p class="Normal-P"> <span class="Normal-H">This is chapter 2</span> </p> <p class="Heading1-P"> <span class="Heading1-H">Chapter 3</span> </p> <p class="Normal-P"> <span class="Normal-H">This is chapter 3</span> </p> 我想解析上面的 HTML 并将内容保存到两个不同的数组中，例如： $heading 和 $content $heading = array('Chapter 1','Chapter 2','Chapter 3'); $content = array('This is chapter 1','This is chapter 2','This is chapter 3'); 我可以简单地使用 jQuery 来实现这一点。但我不确定这是否是正确的方法。如果有人能指出我正确的方向，那就太好了。预先感谢。我已经使用 DOMDocument 和 DOMXPath 来获得解决方案： $test = <<< HTML <p class="Heading1-P"> <span class="Heading1-H">Chapter 1</span> </p> <p class="Normal-P"> <span class="Normal-H">This is chapter 1</span> </p> <p class="Heading1-P"> <span class="Heading1-H">Chapter 2</span> </p> <p class="Normal-P"> <span class="Normal-H">This is chapter 2</span> </p> <p class="Heading1-P"> <span class="Heading1-H">Chapter 3</span> </p> <p class="Normal-P"> <span class="Normal-H">This is chapter 3</span> </p> HTML; $dom = new DOMDocument(); $dom->loadHTML($test); $xpath = new DOMXPath($dom); $heading = parseToArray($xpath,'Heading1-H'); $content = parseToArray($xpath,'Normal-H'); var_dump($heading); echo "<br/>"; var_dump($content); echo "<br/>"; function parseToArray(DOMXPath $xpath, string $class): array { $xpathquery = "//*[@class='$class']"; $elements = $xpath->query($xpathquery); $resultarray = []; foreach ($elements as $element) { $nodes = $element->childNodes; foreach ($nodes as $node) { $resultarray[] = $node->nodeValue; } } return $resultarray; } 尝试查看 PHP 简单 HTML DOM 解析器它具有类似于 jQuery 的出色语法，因此您可以轻松地通过 ID 或类选择任何您想要的元素 // include/require the simple html dom parser file $html_string = ' <p class="Heading1-P"> <span class="Heading1-H">Chapter 1</span> </p> <p class="Normal-P"> <span class="Normal-H">This is chapter 1</span> </p> <p class="Heading1-P"> <span class="Heading1-H">Chapter 2</span> </p> <p class="Normal-P"> <span class="Normal-H">This is chapter 2</span> </p> <p class="Heading1-P"> <span class="Heading1-H">Chapter 3</span> </p> <p class="Normal-P"> <span class="Normal-H">This is chapter 3</span> </p>'; $html = str_get_html($html_string); foreach($html->find('span') as $element) { if ($element->class === 'Heading1-H') { $heading[] = $element->innertext; }else if($element->class === 'Normal-H') { $content[] = $element->innertext; } } 这是使用 DiDOM 解析 html 的另一种方法，它在速度和内存占用方面提供了显着的“更好的性能”。 composer require imangazaliev/didom <?php use DiDom\Document; require_once('vendor/autoload.php'); $html = <<<HTML <p class="Heading1-P"> <span class="Heading1-H">Chapter 1</span> </p> <p class="Normal-P"> <span class="Normal-H">This is chapter 1</span> </p> <p class="Heading1-P"> <span class="Heading1-H">Chapter 2</span> </p> <p class="Normal-P"> <span class="Normal-H">This is chapter 2</span> </p> <p class="Heading1-P"> <span class="Heading1-H">Chapter 3</span> </p> <p class="Normal-P"> <span class="Normal-H">This is chapter 3</span> </p> HTML; $document = new Document($html); // find chapter headings $elements = $document->find('.Heading1-H'); $headings = []; foreach ($elements as $element) { $headings[] = $element->text(); } // find chapter texts $elements = $document->find('.Normal-H'); $chapters = []; foreach ($elements as $element) { $chapters[] = $element->text(); } echo("Headings\n"); foreach ($headings as $heading) { echo("- {$heading}\n"); } echo("Chapter texts\n"); foreach ($chapters as $chapter) { echo("- {$chapter}\n"); } 您的一个选择是使用 DOMDocument 和 DOMXPath。它们确实需要一些曲线来学习，但是一旦你这样做了，你就会对你所取得的成就感到非常满意。在 php.net 中阅读以下内容 http://php.net/manual/en/class.domdocument.php http://php.net/manual/en/class.domxpath.php 希望这有帮助。 // 从 URL 或文件创建 DOM $html = file_get_html('http://www.google.com/'); // 查找所有图像 foreach($html->find('img') as $element) echo $element->src . '<br>'; // 查找所有链接 foreach($html->find('a') as $element) echo $element->href . '<br>';

php html parsing dom

回答 5 投票 0

如何使用 PHP 简单 HTML DOM 解析器找到 HTML 文件中的最后一个元素？

根据 SIMPLE HTML DOM PARSER 的文档（在“如何修改 HTML 元素”选项卡下），此代码找到的第一个实例： $html = str_get_html('<... 根据 SIMPLE HTML DOM PARSER 的文档（在“如何修改 HTML 元素”选项卡下），此代码找到 <div class="hello"> 的第一个实例： $html = str_get_html('<div class="hello">Hello</div><div class="world">World</div>'); $html->find('div[class=hello]', 0)->innertext = 'foo'; echo $html; // Output: <div class="hello">foo</div><div class="world">World</div> 如果我想将 'foo' 插入到 <div class="hello"> 的 last 实例中，假设 HTML 代码有很多 <div class="hello"> 实例，该怎么办。应该用什么来代替 0？好吧，自从 // Find all anchors, returns a array of element objects $ret = $html->find('whatever'); 返回一个 array 包含所有 <whatever> 元素，您可以使用 PHP 的常规数组函数获取最后一个元素，例如与 end $last = end($ret); 如果SimpleHtmlDom完全实现了CSS3 Selectors进行查询，您还可以修改您的查询来使用 :last-of-type 仅查找返回节点列表中的最后一个同级。来自手册： // Find lastest anchor, returns element object or null if not found (zero based) $ret = $html->find('a', -1); lastChild 属性返回元素的最后一个子对象。编辑：显然不是 JQuery :) 请参阅 W3C 选择器参考：http://www.w3.org/TR/css3-selectors/#last-child-pseudo 最初的帖子问题是“应该用什么代替 0？” 答案：-1

php html parsing dom

回答 4 投票 0

当 Angular 2 组件属性更改时更新 DOM

我最近刚刚从 Angular 1 迁移到 Angular 4，我很难理解为什么组件属性更新时 DOM 没有更新。我搜索并阅读了无数

html angular dom

回答 2 投票 0

获取 ul li 字符串值并将它们存储在变量或数组中 php [关闭]

我正在尝试将网站上列表项的字符串值存储到 PHP 中的变量/数组中，以对它们进行一些条件检查/语句。我在获取列表时遇到了一些困难...

php html string dom getelementsbyclassname

回答 3 投票 0

BeautifulSoup：跳过 html 元素

我有以下html结构：这只是其中的一部分，但我认为这个片段足以解释我的问题。色彩文摘 AgAkAZwCJ...

python html web-scraping dom beautifulsoup

回答 2 投票 0

动态显示图像时显示轻微延迟

我有一个页面，当单击各种按钮时动态显示图像。一切都很完美。但是，我希望每个新创建的图像都稍微延迟地出现在页面上，...

javascript image dom dynamic

回答 1 投票 0

DOM 抓取无法运行 PHP

我只是想知道为什么这对我不起作用。我想要做的是删除 m4v 文件。我有一个类似的脚本用于我网站上的图像，它将剥离图像，上传到目录并

php html parsing web-scraping dom

回答 2 投票 0

如何用Java解析BPMN文件？

我对 Java 和 BPMN 都没有太多经验，但我的目标是创建一个代码来解析 .bpmn 文件并从中推断出一些信息。我不需要执行这些流程，我只需要...

java xml parsing dom bpmn

回答 3 投票 0

使用 PHP Simple Html Dom 获取不同类型的前一个元素？

希望这可以通过 Simple Html Dom 实现，我正在抓取一个如下所示的页面：这是标题1 这是标题2 希望这可以通过 Simple Html Dom 实现，我正在抓取一个如下所示的页面： <h5>this is title 1</h5> <img> <img> <img> <h5>this is title 2</h5> <img> <img> <h5>this is title 3</h5> <img> <img> <img> <img> 等等... 我试图让它看起来像： <h5>this is title 1</h5> <img> <h5>this is title 1</h5> <img> <h5>this is title 1</h5> <img> <h5>this is title 2</h5> <img> <h5>this is title 2</h5> <img> 我想，这意味着对于每个 IMG，我需要找到并获取第一个之前的 H5。没有父级 div 或任何结构可以使它变得更容易，这几乎就是我所描述的。我使用的代码看起来像这样（简化）： foreach($html->find('img') as $image){ //do stuff to the img $title = $html->find('h5')->prev_sibling(); echo $title; echo $image;} 我对 prev_sibling 尝试过的所有操作都会出现“致命错误：在非对象上调用成员函数 prev_sibling()”，我想知道我想要做的事情是否可以使用 PHP Simple HTML Dom 。我希望如此，我尝试过的所有其他刮刀都让我把头发拔掉。是的，因为你没有将整个页面作为 dom 加载，所以你本质上拥有的是 DOMElement 列表，而前一个子元素将为 NULL。您基本上可以做的是拥有一个移动指针，而不是之前查找 $all = get all elements, $title = null; foreach ($all as $e) { if ($e == "h5") { $title = $e; continue; } echo $title . $e; } 有一些 sedo 代码，但你会明白我的意思。本质上，您想要选择所有 h5 元素以及所有 img 元素。然后，循环遍历它们并检查它们的类型。如果它是 h5 元素，则更新 $title 变量，但不更新 echo 任何内容。如果它是 img，您只需在图像之前回显 $title 即可。现在无需去寻找 h5，因为您已经缓存了它。这是一个例子： foreach ( $html->find('h5, img') as $el ) { if ( $el->tag == 'h5' ) { $title = $el->plaintext; continue; } echo "<h5>$title</h5>"; echo $el->outertext; }

php web-scraping dom

回答 2 投票 0

如何使用 javascript 更改切换开关的背景颜色？

我正在创建一个图书馆项目，每本书都是一个对象，其属性标题、作者、页数和阅读状态存储在数组中。有一个“添加书籍”按钮，可以打开一个模式并询问用户...

javascript html css dom

回答 1 投票 0

document.activeElement 不显示阴影根中的焦点元素

document.activeElement 很简洁，但是当在使用影子根的网站上使用它时 - 我得到了外部容器。如何获取嵌套阴影根中的活动元素？我需要爬过去吗

javascript html dom dom-events

回答 1 投票 0

如何从其兄弟节点获取img的src和数据

loadHtmlFile(http://www.amazon.com); $xpath = new DOMXPath( $htmlget); $nodelist = $xpath->query( "//img/@src" ); foreach ($点头...

php html dom html-parsing siblings

回答 1 投票 0

如何使用javascript填写表单字段并提交？

如果我有一个 html 文档，其大致结构是 ..东西... 如果我有一个html文档，其大致结构是 <html> <head> </head> <body class="bodyclass" id="bodyid"> <div class="headerstuff">..stuff...</div> <div class = "body"> <form action="http://example.com/login" id="login_form" method="post"> <div class="form_section">You can login here</div> <div class="form_section"> <input xmlns="http://www.w3.org/1999/xhtml" class="text" id="username" name="session[username_or_email]" tabindex="1" type="text" value="" /> </div> <div class="form_section">etc</div> <div xmlns="http://www.w3.org/1999/xhtml" class="buttons"> <button type="submit" class="" name="" id="go" tabindex="3">Go</button> <button type="submit" class="" name="cancel" id="cancel" tabindex="4">Cancel</button> </div> </form> </div> </body> </html> 您可以看到有一个用户名字段和一个“Go”按钮。我如何使用 Javascript 填写用户名并按 Go...？我更喜欢使用纯 JS，而不是像 jQuery 这样的库。 document.getElementById('username').value="moo"; document.forms[0].submit(); 通过文档对象访问。 document.getElementById('username').value = 'foo'; document.getElementById('login_form').submit(); 你可以尝试这样的事情： <script type="text/javascript"> function simulateLogin(userName) { var userNameField = document.getElementById("username"); userNameField.value = userName; var goButton = document.getElementById("go"); goButton.click(); } simulateLogin("testUser"); </script> 它会是这样的： document.getElementById("username").value="Username"; document.forms[0].submit() 或类似编辑：你们太快了;) 这个方法帮助我完成了这项任务 document.forms['YourFormNameHere'].elements['NameofFormField'].value = "YourValue" document.forms['YourFormNameHere'].submit();

javascript dom

回答 5 投票 0

如何使用 JavaScript 中的 DOM 使石头剪刀布游戏在回合之间前进？

我正在用 JavaScript 制作石头、剪刀、布游戏，但我陷入了困境。问题是我无法让循环工作以允许我在游戏中玩 5 轮、保留轮计数器并更新...

javascript dom

回答 1 投票 0

如何选择在 DOM 之后渲染的 HTML 元素

我想选择OKBTN 让 main = document.querySelector("#main"); 让 okBtn = document.querySelector("#ok"); 函数 myAlert(标题,消息,图标){ 让卡=“”； ...

javascript dom modal-dialog jquery-selectors addeventlistener

回答 1 投票 0

为什么我会收到 ParseError？

我正在尝试使用 DOMParser 方法 .parseFromString 将包含 HTML 的数组中的字符串转换为 DOM 元素。有些字符串出现以下解析错误，我无法...