如何单击网页上仅显示 <li class="" data-type="" 的元素答案

【问题标题】：How to click an element on webpage only showing <li class="" data-type=""如何单击网页上仅显示 <li class="" data-type="" 的元素
【发布时间】：2014-10-14 13:38:33
【问题描述】：

我正在尝试开发 VBA Internet Explorer 自动化解决方案。我有一个我想点击的链接，检查我得到的元素<li class="expMenuItem listTypes dataTypeMaterialId" data-type="MaterialId">Substance Identifier</li>。什么是正确的代码？谢谢。

【问题讨论】：

您是否想问如何使用 VBA 或 JavaScript 以编程方式单击网页上已存在的（超）链接？ li 元素不是链接。
我只是问在这种情况下什么是合适的方法，我知道 getElementbyID 和 getElementsByName，但在这种情况下我不能使用它们。也许我不应该使用链接这个词，元素会更合适，但是当点击这个元素时，会运行某个 javascript

标签： javascript vba internet-explorer automation

【解决方案1】：

来自您的评论：

“我只是问在这种情况下什么是合适的方法，我知道 getElementbyID 和 getElementsByName，但在这种情况下我不能使用它们。”

您似乎在问如何选择一个元素以便为其分配一个点击处理程序，而您唯一需要选择它的是类名或data- 属性。

您可以使用.getElementsByClassName() method 选择具有特定类的元素。请注意，它会返回匹配元素的 HTMLCollection，因此如果您希望只有一个元素，则必须检查结果的 .length 是否为 1，如果您希望有多个元素，则必须在循环中处理结果：

var elmts = document.getElementsByClassName("dataTypeMaterialId");
if (elmts.length === 1 )
  elmts[0].addEventListener("click", function() { /* do something */ }, false);

演示：http://jsfiddle.net/zw3g69ry/1/

或者，您可以使用.querySelector() 根据 CSS 样式选择器选择单个元素，或使用 .querySelectorAll() 选择与 CSS 样式选择器匹配的多个元素：

var elmt = document.querySelector('[data-type="MaterialId"]')
if (elmt)
  elmt.addEventListener("click", function(e) {
      /* do something */
      alert("Element clicked - " + e.target.innerHTML);
  }, false);

演示：http://jsfiddle.net/zw3g69ry/2/

我提到的所有方法都可以在 document 上调用（正如我所做的那样），或者如果您只想在该容器内查看，则可以在特定容器元素上调用。

【讨论】：

【解决方案2】：

这是首选。不要模拟点击。以编程方式打开 URL。

选项显式

Public Sub OpenUrl(ByVal argURL As String)

常量 READYSTATE_COMPLETE As Integer = 4

将 objIE 调暗为对象

设置 objIE = CreateObject("InternetExplorer.Application")

使用 objIE .可见=假 .静音=真 .导航 argURL 直到 .ReadyState = READYSTATE_COMPLETE 做事件环形结束于

objIE.退出设置 objIE = 无

结束子

【讨论】：