如何在单击 div 时更改 div 的样式

Question

我做了一个网站，将记录和图像保存在数据库中。
但是当我单击div并查看任何成员的记录时，我想更改div 颜色以及何时看到记录。
我想更改div 的样式。
当我单击任何div 时，图像加载到此div 上。我该怎么做？
这意味着style1单击任何div 时处理div
我的代码是：

<script>
function changelod(obj)
{
obj.setAttribute("class", "style1");
}
</script>

<style>
.style1{background:transparent url('12/loading.gif') 50% 50% no-repeat;}
#content {clear:left;overflow:auto;width:780px;height:auto;padding:5px 5px;}
#left {float:left;width:242px;padding:5px 5px;border:1px solid #000;}
</style>

<div id="content">
<div id="left">
<div id="leftbox" class="style">
<a onclick="changelod(this);" href="members.php&code=<?php echo $myrowadfix["securtycode"]; ?>" target="_blank">
<div id="boxbody">
<img src="img/8.gif" height="100" width="100">
<p><?php echo $myrowadfix["histrym"]; ?>">
</div>
</a>
</div>
</div>
<div id="left">
<div id="leftbox" class="style">
<a onclick="changelod(this);" href="members.php&code=<?php echo $myrowadfix["securtycode"]; ?>" target="_blank">
<div id="boxbody">
<img src="img/8.gif" height="100" width="100">
<p><?php echo $myrowadfix["histrym"]; ?>">
</div>
</a>
</div>
</div>
<div id="left">
<div id="leftbox" class="style">
<a onclick="changelod(this);" href="members.php&code=<?php echo $myrowadfix["securtycode"]; ?>" target="_blank">
<div id="boxbody">
<img src="img/8.gif" height="100" width="100">
<p><?php echo $myrowadfix["histrym"]; ?>">
</div>
</a>
</div>
</div>
</div>
<div id="content">
<div id="left">
<div id="leftbox" class="style">
<a onclick="changelod(this);" href="members.php&code=<?php echo $myrowadfix["securtycode"]; ?>" target="_blank">
<div id="boxbody">
<img src="img/8.gif" height="100" width="100">
<p><?php echo $myrowadfix["histrym"]; ?>">
</div>
</a>
</div>
</div>
<div id="left">
<div id="leftbox" class="style">
<a onclick="changelod(this);" href="members.php&code=<?php echo $myrowadfix["securtycode"]; ?>" target="_blank">
<div id="boxbody">
<img src="img/8.gif" height="100" width="100">
<p><?php echo $myrowadfix["histrym"]; ?>">
</div>
</a>
</div>
</div>
<div id="left">
<div id="leftbox" class="style">
<a onclick="changelod(this);" href="members.php&code=<?php echo $myrowadfix["securtycode"]; ?>" target="_blank">
<div id="boxbody">
<img src="img/8.gif" height="100" width="100">
<p><?php echo $myrowadfix["histrym"]; ?>">
</div>
</a>
</div>
</div>
</div>

此代码中的帮助我尝试此代码，但div 在此上移动页面顶部和图像加载
，并在此div
上显示滚动条

Answer 1

在你的 changelod(obj( 函数中，obj 是 TAG ，因为你传递了这个参数。

如果你想改变他的父级( (，你只需要选择它的父级：

obj.parentNode.setAttribute("class", "style1");

作为参考，您可以在此处阅读以下内容：https://www.w3schools.com/jsref/prop_node_parentnode.asp

Answer 2

希望这对您有所帮助

function changelod(obj) { 
obj.parentNode.setAttribute("class", "style1");
}