单击对内部元素执行某些操作

onclick do something to the element inside

本文关键字:操作 执行 元素 内部 单击      更新时间:2023-09-26
<li onclick='doSomething(this)'><img src='pix.png' /><a href='#'>link</a></li>
<li onclick='doSomething(this)'><img src='pix2.png' /><a href='#'>link2</a></li>

当列表是点击时,我希望该列表中 img 的显示属性变为"内联"

function doSomething(obj)
{
    //how to make <img> inside the onclick <li> display=inline
}

如何使用该函数调用来处理这个问题,我想要这样,因为我有一个这样格式化的现有代码。

谢谢!

这应该可以解决问题

function doSomething(obj)
{
    obj.getElementsByTagName("img")[0].style.display = "inline";
}

您可以在传递的obj上使用getElementsByTagName来查找img标签:

function doSomething(obj) {
  var images = obj.getElementsByTagName("img");
  for(var i in images) {
    images[i].style.display = "inline";
  }
}

尽管这里的每个人都会告诉您不应该再使用内联点击处理程序(这是正确的),但我会理所当然地认为您别无选择。

您可以按如下方式为 img 元素分配 id:

<li onclick='doSomething("img1")'><img id='img1' src='pix.png' /><a href='#'>link</a></li>
<li onclick='doSomething("img2")'><img id='img2' src='pix2.png' /><a href='#'>link2</a></li>

然后:

function doSomething(id)
{
    document.getElementById(id).style.display = "inline";
}