Question

我尝试将id名称html传递给js函数，我有代码html：

<ul>
<li>
  <a href="javascript:animal()">
    <span class="animal" id="ani 1">dog</span>
  </a>
</li>
<li>
  <a href="javascript:animal()">
    <span class="animal" id="ani 2">dog</span>
  </a>
</li>
<li>
  <a href="javascript:animal()">
    <span class="animal" id="ani 2">dog</span>
  </a>
</li>

我想要一些东西的span标签的id名称。如何将其传递给函数？

Answer 1

此处的分配需要修复

1）Id是您想要独特的，只有

之一

2）使用onclick属性来处理Javascript函数。

3）为了这个例子，传递元素的id的最简单方法是将它作为参数传递。

贝娄是我如何看待你所要求的一个例子。然而，让你的Javascript使用甚至是听众通常是更好的做法。

    <ul>
<li>
    <a href="#" onclick="animal('ani1')">
     <span class="animal" id="ani1" >dog</span>
    </a>
</li>
<li>
  <a href="#" onclick="animal('ani2')">
   <span class="animal" id="ani2">dog</span>
  </a>
</li>
<li>
 <a href="#" onclick="animal('ani1')">
  <span class="animal" id="ani3">dog</span>
 </a>
</li>

如果你愿意多写一点，那么更好的方法Javascript就是检测id函数中的子元素animal。

function animal(){
   var id = this.childNodes.querySelector('span').id;
}

这样就不必将id名称作为参数写入函数。

Answer 2

使用＆＃34; event.target.id＆＃34;，这将为您提供元素的ID。

Answer 3

有几种方法可以实现这一目标。

第一个是，如果您的标记是静态的并且您正在调用函数，就像您在示例中一样，您可以将ID作为参数传递给!config/.gitignore函数，如下所示：

.gitignore

然后你可以在你的javascript中使用这个参数：

animal()

另一种选择是使用jQuery并通过自定义<ul> <li> <a href="javascript:animal('ani-1')"> dog </a> </li> <li> <a href="javascript:animal('ani-2')"> dog </a> </li> <li> <a href="javascript:animal('ani-3')"> dog </a> </li> </ul>属性为元素添加功能。

function animal(animalId) {
  console.log('the animal\'s id is' + animalId);
}

还有其他一些方法可以做到这一点，但是你打算如何使用这个ID，以及你打算如何建立你的标记可以并且将决定你采取的最佳方法。

如何将id name html传递给js函数

3 个答案:

此处的分配需要修复