Question

以编程方式（控制台）点击li元素“ 过去30天”

spectral_modifier = atmosphere.first_solar_spectral_correction(…)
effective_irradiance = (poa_irrad.poa_direct * pvsystem.physicaliam(aoi) * cos(aoi) + poa_irrad.poa_diffuse) * spectral_modifier

我尝试了很多方法但都失败了

就像。

<div class="ranges">
      <ul>
        <li>Today</li>
        <li >Yesterday</li> 
        <li>Last 7 days</li>
        <li>Last 30 days</li>
        <li class="">This month</li>
        <li>Custom Range</li>
    </ul>
  </div>

我是JavaScript新手，请帮助我

Answer 1

根据内部HTML触发点击。

let listItems = document.querySelectorAll('.ranges li');

listItems.forEach((item, index) => {
  item.addEventListener('click', (event) => {
     alert(`${event.currentTarget.innerHTML} item was click`);
  });
  if (item.innerHTML.indexOf('Last 30 days') != -1) {
      item.click();
  }
});

<div class="ranges">
    <ul>
      <li>Today</li>
      <li>Yesterday</li> 
      <li>Last 7 days</li>
      <li>Last 30 days</li>
      <li>This month</li>
      <li>Custom Range</li>
  </ul>
</div>

Answer 2

您这里拥有的东西看起来像jQuery（或类似jQuery的东西）—不是纯自然的JavaScript。我之所以提及这一点，只是出于完整性和适当的标记。

也就是说，假设您实际上已经加载了jQuery，这将失败，因为您的选择器没有匹配任何内容。 $('#...')通过ID匹配DOM元素。您没有任何ID。这会起作用：

<div class="ranges">
  <ul>
    <li>Today</li>
    <li >Yesterday</li> 
    <li>Last 7 days</li>
    <li id="target">Last 30 days</li>
    <li class="">This month</li>
    <li>Custom Range</li>
  </ul>
</div>
<script>
  $('#target').click();
</script>

CSS不会按内容处理元素，jQuery也不会。您可以找到实现它的方法，但是效率极低（这就是为什么它不是内置的）。如果可以的话，最好只识别每个<li>。

您还可以按类别定位：$('.classname')。但是，虽然按ID定位通常只会命中一个元素，但按类定位却会匹配所有匹配元素。

我还注意到，您似乎没有对click元素上的<li>事件附加任何操作，因此我不确定您是否会注意到click事件是否成功，除非您遇到的情况超出您的描述。

Answer 3

尝试

function clicked() { console.log('clicked!') }

ccc.click();

<div class="ranges">
  <ul>
    <li>Today</li>
    <li>Yesterday</li>
    <li>Last 7 days</li>
    <li id="ccc" onclick="clicked()">Last 30 days</li>
    <li class="">This month</li>
    <li>Custom Range</li>
  </ul>
</div>

以编程方式单击li元素JavaScript

3 个答案: