Question

<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的display属性变为“inline”

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

如何使用该函数调用处理此问题，我想这样，因为我有一个以这种方式格式化的现有代码。

谢谢！

Answer 1

应该做的伎俩

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

Answer 2

您可以对传递的getElementsByTagName使用obj来查找img代码：

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

Answer 3

虽然这里的每个人都会告诉你不再使用内联onclick处理程序（这是正确的），但我会认为你别无选择。

您可以将ID分配给img元素：

<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";
}

javascript - onclick对内部元素做了一些事情

3 个答案: