获取活动 li href 名称的 Javascript

Question

我需要获取活动的 href 名称在我页面上选择的选项卡上。 如下面的代码所示，由于“href: popular”处于活动状态，我希望将其返回我想捕获这是一个使用 javascript 的 JS 变量。谁能帮我解决这个问题。我使用了下面的代码但没有运气function() {  var element=document.querySelector('ul.uk-tab tabs > li');  var content=element?element.textContent:undefined;  return content;}

Answer 1

由于这是用 google-tag-manager 标记的，因此您不应该自己编写自定义 Javascript（GTM 已经包含一个选择器引擎）。

转到变量，新建，选择“DOM 元素”，将选择方法下拉列表切换到“CSS 选择器”，从评论或答案中输入选择器（或“属性包含”选择器，例如 li[class*="active"] >a 如果您不是特别关注 uk-active，而是所有活动链接）。

这将返回所选元素的 innertext 属性，或者，如果你想要一个属性值，你可以在相应的文本字段中输入属性的名称：

Answer 2

解决方案：

let el=document.querySelector(".uk-active a"),

    hrefrel=el.getAttribute("href"),

    hrefabs=el.href,

    text=el.textContent;

console.log(`hrefrel: ${hrefrel}\nhrefabs:  ${hrefabs}\ntext: ${text}`);

// or, combined as an object:

console.log({hrefrel,hrefabs,text})

<section class="section tabs-container homepage main-container" data-tabs-container-tabifier data-containerid="tabgrp-collections-and-reading" data-getitemcount="2">

  <ul class="uk-tab tabs" data-tabs>

    <li role="tab" aria-expanded="false" class><a href="#firstplace">Latest</a></li>

    <li role="tab" class="uk-active" aria-expanded="true"><a href="#someplace">Popular</a></li>

  </ul>

</section>

我稍微修改了href你的，否则结果将毫无意义。<a>