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

【问题标题】：how to change the style of div on click div如何在单击 div 时更改 div 的样式
【发布时间】：2018-12-07 10:09:45
【问题描述】：

我做了一个网站，将记录和图像保存在数据库中。
但是，当我点击 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 上显示滚动条

【问题讨论】：

函数 changelod(obj) { obj.parentNode.setAttribute("class", "style1"); }没有工作

标签： javascript html css styles

【解决方案1】：

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

如果你想改变他父母的班级（），你只需要选择这个的父母：

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

作为参考，你可以在这里阅读：https://www.w3schools.com/jsref/prop_node_parentnode.asp

【讨论】：

【解决方案2】：

希望对你有帮助

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

【讨论】：