javascript获取ul标签的id,如何才能改变ul内li的背景颜色等属性
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了javascript获取ul标签的id,如何才能改变ul内li的背景颜色等属性相关的知识,希望对你有一定的参考价值。
如题,我写的代码是这样的,但是没效果,请高手帮忙看看,谢谢!!
window.onload=init;
function init()
var menu=document.getElementById("menu");
var lis = ul.getElementsByTagName("li");
for (var i = 0; i < lis.length; i++)
//鼠标经过事件
lis[i].onmouseover = function ()
var ul = document.getElementById("menu");
var lis = ul.getElementsByTagName("li");
var li = lis[i];
if (li == this)
li.style.background = "red";
使用jquery的选择器获取ul里的所有li元素,然后用jquery提供的.css(name, value)方法修改所有li的css属性,即background-color
如果ul的id的变量名为ulid
$("li","#" + ulid).css("background-color","#ccc");这个用到了jquery的选择器规则$(selector1, content)
selector1是一个选择器。content可以是一个选择器、一个jquery dom对象或者原生dom对象,上面的代码中conten是一个选择器
这个写法的意思是选择content中所有符合selector1的元素,在上面的代码里面就表示“选择id为ulid变量值的ul中所有的li元素”
.css(name, value)方法是改变名称为name的css属性为value,有数值单位的可以省去单位,如padding 30px的值可以直接写.css("padding", 30)
.css(name)是获取名称为name值的css属性值,如.css("padding")返回padding的值,不带单位,如.css("padding")返回30
参考技术A用jquery写个给你行吗?jquery你自己下个~和这段代码放一起就行了
<script src="jquery.js"></script><script>
function changebackground(id)
if(id=='li1')
$('#'+id).css(background:"red");
if(id=='li2')
$('#'+id).css(background:"blue");
if(id=='li3')
$('#'+id).css(background:"yellow");
if(id=='li4')
$('#'+id).css(background:"green");
;
</script>
<body>
<div style="width:100px;height:400px" id="menu">
<li id="li1" style="width:100px;height:100px" onmouseover="changebackground(this.id)">1</li>
<li id="li2" style="width:100px;height:100px" onmouseover="changebackground(this.id)">2</li>
<li id="li3" style="width:100px;height:100px" onmouseover="changebackground(this.id)">3</li>
<li id="li4" style="width:100px;height:100px" onmouseover="changebackground(this.id)">4</li>
</div>
</body> 参考技术B 直接用css在li上面加上hover处理就可以,没必要用js
而且li == this这个是有问题,这个this对象用的并不正确。追问
用hover是处理超链接吧,可是我想改变背景颜色啊
追答hover是CSS的鼠标伪事件
参考技术C 你不就想改变背景么,有什么难度么?直接给个id就可以了!不会直接q我,244267510本回答被提问者采纳
如何用ul li 标签动态获取数据库中10条数据并有连接 麻烦详细点
datalist数据绑定,把标签加进<ItemTemplate>可以实现 参考技术A <ul><li><a href="链接地址?id=内容的id">数据库内容标题</a></li>
</ul>
利用程序循环输出li节点
以上是关于javascript获取ul标签的id,如何才能改变ul内li的背景颜色等属性的主要内容,如果未能解决你的问题,请参考以下文章
<ul>标签两层嵌套如何在js中找到第二层<li>标签,不用获取id的方法。两层<li>标签的class是一样的。