JS （javaScript）中获取CSS背景颜色的问题
代码很简单，就是让我鼠标滑过任意一个<li>标签的时候让其变背景颜色，但是我的代码似乎有点问题，没有效果，请懂的看一下varoint=document.getElemen...
代码很简单，就是让我鼠标滑过任意一个<li>标签的时候让其变背景颜色，但是我的代码似乎有点问题，没有效果，请懂的看一下
var oint=document.getElementById('box3');
var ointli=oint.getElementsByTagName('ul');
for(i=0;i<ointli.length;i++)
{
ointli[i].onmouseover=function()
{
ointli[0].style.backgroundColor=;
}
}
<div id="box3">
<ul id="int">
<li>第一行文字</li>
<li>第二行文字</li>
<li>第三行文字</li>
<li>第四行文字</li>
<li>第五行文字</li>
</ul>
</div> 展开
var oint=document.getElementById('box3');
var ointli=oint.getElementsByTagName('ul');
for(i=0;i<ointli.length;i++)
{
ointli[i].onmouseover=function()
{
ointli[0].style.backgroundColor=;
}
}
<div id="box3">
<ul id="int">
<li>第一行文字</li>
<li>第二行文字</li>
<li>第三行文字</li>
<li>第四行文字</li>
<li>第五行文字</li>
</ul>
</div> 展开
2016-01-30 · 百度知道合伙人官方认证企业
育知同创教育
1【专注：Python+人工智能|Java大数据|HTML5培训】 2【免费提供名师直播课堂、公开课及视频教程】 3【地址：北京市昌平区三旗百汇物美大卖场2层，微信公众号：yuzhitc】
向TA提问
关注
![]()
展开全部
<!DOCTYPE html>
<html>
<head>
<title>getHexColor js/jQuery 获得十六进制颜色</title>
<meta charset="utf-8" />
<script type="text/javascript">
function getHexBgColor(){
var str = [];
var rgb = document.getElementById('color').style.backgroundColor.split('(');
for(var k = 0; k < 3; k++){
str[k] = parseInt(rgb[1].split(',')[k]).toString(16);
}
str = '#'+str[0]+str[1]+str[2];
document.getElementById('color').innerHTML = str;
}
function getHexColor(){
var str = [];
var rgb = document.getElementById('color').style.color.split('(');
for(var k = 0; k < 3; k++){
str[k] = parseInt(rgb[1].split(',')[k]).toString(16);
}
str = '#'+str[0]+str[1]+str[2];
document.getElementById('color').innerHTML = str;
}
</script>
<style type="text/css">
#color{
width: 200px;
height: 200px;
line-height: 200px;
text-align: center;
}
</style>
</head>
<body>
<div style="color: #88ee22; background-color: #ef8989;" id="color"></div>
<input onclick="getHexBgColor();" type="button" value="获得背景色" />
<input onclick="getHexColor();" type="button" value="获得字体颜色" />
</body>
</html>
点击“获得背景色”按钮，会调用getHexBgColor()方法获取css的背景色。
<html>
<head>
<title>getHexColor js/jQuery 获得十六进制颜色</title>
<meta charset="utf-8" />
<script type="text/javascript">
function getHexBgColor(){
var str = [];
var rgb = document.getElementById('color').style.backgroundColor.split('(');
for(var k = 0; k < 3; k++){
str[k] = parseInt(rgb[1].split(',')[k]).toString(16);
}
str = '#'+str[0]+str[1]+str[2];
document.getElementById('color').innerHTML = str;
}
function getHexColor(){
var str = [];
var rgb = document.getElementById('color').style.color.split('(');
for(var k = 0; k < 3; k++){
str[k] = parseInt(rgb[1].split(',')[k]).toString(16);
}
str = '#'+str[0]+str[1]+str[2];
document.getElementById('color').innerHTML = str;
}
</script>
<style type="text/css">
#color{
width: 200px;
height: 200px;
line-height: 200px;
text-align: center;
}
</style>
</head>
<body>
<div style="color: #88ee22; background-color: #ef8989;" id="color"></div>
<input onclick="getHexBgColor();" type="button" value="获得背景色" />
<input onclick="getHexColor();" type="button" value="获得字体颜色" />
</body>
</html>
点击“获得背景色”按钮，会调用getHexBgColor()方法获取css的背景色。
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
var ointli=document.getElementsByTagName('ul');
并且这个方法是在整个页面都没有加载完的时候 获取的 ，你可以把js写在div的下面 也可以用body的onload()方法
其实要做成这种效果用Jquery最好了，有时间可以去学习一下
并且这个方法是在整个页面都没有加载完的时候 获取的 ，你可以把js写在div的下面 也可以用body的onload()方法
其实要做成这种效果用Jquery最好了，有时间可以去学习一下
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
var oint=document.getElementById('box3');
var ointli=oint.getElementsByTagName('li');
var funny = function (i)
{
ointli[i].onmouseover = function()
{
ointli[i].style.backgroundColor = "red";
}
ointli[i].onmouseout = function ()
{
ointli[i].style.backgroundColor = "";
}
};
for (var i = 0; i < ointli.length; i++)
{
funny(i);
}
本回答被网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
<html>
<head></head>
<body>
<div id="box3">
<ul id="int">
<li>第一行文字</li>
<li>第二行文字</li>
<li>第三行文字</li>
<li>第四行文字</li>
<li>第五行文字</li>
</ul>
</div>
<script type="text/javascript">
var oint=document.getElementById('box3');
var ointli=oint.getElementsByTagName('li');
for(i=0;i<ointli.length;i++)
{
bindMouse(ointli[i]);
}
function bindMouse(_this){
_this.onmouseover=function(){
_this.style.backgroundColor="red";
}
_this.onmouseout=function(){
_this.style.backgroundColor = "";
}
}
</script>
</body>
</html>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
var ointli=document.getElementsByTagName('li');
for(i=0;i<ointli.length;i++)
{
ointli[i].onmouseover=function()
{
this.style.backgroundColor="red";
}
}
你试试
for(i=0;i<ointli.length;i++)
{
ointli[i].onmouseover=function()
{
this.style.backgroundColor="red";
}
}
你试试
追问
大哥为啥用我的ointli[i] 就不行？ 你的this是正确的，理论上来说你的this指的就是ointli[i] 啊
追答
应该是方法本身不能调用他自己的吧
var ointli=document.getElementsByTagName('li');这个ointli[i]和
ointli[i].onmouseover=function()
{
ointli[i].style.backgroundColor="red";//这个的ointli不是同一个方法中的，浏览器显示的是ointli[i]没有定义
}
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（4）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
