Question

我有一个用DOM和Javascript创建的小代码。它应该在链接下面创建工具提示。它适用于一个链接，但现在我才意识到我确实需要多个链接，所以我不能像现在一样使用<a id>。

在我的代码中，我目前已经注释掉了xmlhttp部分，但我将来确实需要它。不要介意它。

使用Javascript：

   function createTooltip(str)
   {
      if (str == "" || !str)
      {
         return;
      }

      if (window.XMLHttpRequest)
      {
         xmlhttp = new XMLHttpRequest();
      }
      else // for IE5 and IE6
      {
         xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
      }

      /*xmlhttp.onreadystatechange = function()
      {
         if (xmlhttp.readyState==4 && xmlhttp.status==200)
         {*/
            //document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
            var tooltip = document.createElement("div");
            var link = document.getElementById("tooltip");
            tooltip.setAttribute('id', 'tooltip-style');
            tooltip.innerHTML = "<p>piece of crap</p>";

            if (str == link.rel)
            {
               link.parentNode.insertBefore(tooltip, link.nextSibling);
            }
         /*}
      }
      xmlhttp.open("GET", "tooltip.php?s="+str, true);
      xmlhttp.send();*/
   }

   function removeTooltip(str)
   {
      var tooltip = document.getElementById("tooltip-style");
      tooltip.setAttribute('id', '');
      tooltip.innerHTML = "";
   }

HTML：

<a href="#" rel="35" onmouseover="createTooltip(this.rel);" onmouseout="removeTooltip(this.rel);" id="tooltip">Item</a><br><br>
<a href="#" rel="25" onmouseover="createTooltip(this.rel);" onmouseout="removeTooltip(this.rel);" id="tooltip">Item</a>

代码应该在您悬停的链接下方创建一个div块，而不是在每个链接上。我尝试使用getElementByClassName多个小时，但我无法让它工作。另请注意，<a rel>值最有可能在将来成为唯一值。

感谢您的时间。我很感激。

Answer 1

var a = getElementsByClassName('classname');
for(var i=0; i<a.length; i++){
     //each element will be a[i] do whatever with them you want
}

具有多个结果的getElementsByClassName

1 个答案: