javascript - 将函数传递给工具提示

Question

我正在打印与帖子相关的标签，结果如下所示:

function getTag(){
  
  return "browse posts related to" + this.innerHTML;

}

span, a{
  background: red; 
  color: #fff; 
  margin: 3px; 
  padding: 1px;
  text-decoration: none;
}

Tags: <span title= 'getTag()'>
<a href="#"> food </a>
</span>

<span title= 'getTag()'>
<a href="#"> recipe </a>
</span>

<span title= 'getTag()'>
<a href="#"> drink </a>
</span>

我尝试将函数 getTag() 传递给属性 title，但无法正常工作。

如何使用 JavaScript 获取每个 span 元素的文本内容并将文本内容传递给每个 span 的 title 属性元素。

我喜欢使用 JavaScript 来实现这一点。

Answer 1

在不使用任何库的情况下，您需要使用 DOM。将脚本元素放置在页面底部。

<script>
var spans = document.querySelectorAll('span');

for (var i = 0; i < spans.length; i++) {
  spans[i].title = 'browse posts related to ' + spans[i].innerHTML;
}
</script>

该脚本很容易理解。您告诉浏览器获取所有 span 元素并将它们存储在名为 spans 的变量中。在下一步中，您可以循环遍历每个跨度并操作它们的属性。