如何用原生js改变某id下的li的class?
<nav><divid="nav"><ulid="MainNav"><liclass=""onmouseover="one(1);"><ahref="A">A</a></...
<nav>
<div id="nav">
<ul id="MainNav">
<li class="" onmouseover="one(1);"><a href="A">A</a></li>
<li class="" onmouseover="one(2);"><a href="B">B</a></li>
</ul>
</div>
<ul id="SunNav">
<li class="" > <a href="a">a</a></li>
<li class=""> <a href="b">b</a></li>
</ul>
</nav>
<script type="text/javascript">
function one(num)
{
}
</script>
通过one 传递过来的数字 改变SunNav 里面的li 的class 传递过来1 就改变第一条li 传递过来二 就改变2 ,前提是不能用jquery 必须用原生的JS 展开
<div id="nav">
<ul id="MainNav">
<li class="" onmouseover="one(1);"><a href="A">A</a></li>
<li class="" onmouseover="one(2);"><a href="B">B</a></li>
</ul>
</div>
<ul id="SunNav">
<li class="" > <a href="a">a</a></li>
<li class=""> <a href="b">b</a></li>
</ul>
</nav>
<script type="text/javascript">
function one(num)
{
}
</script>
通过one 传递过来的数字 改变SunNav 里面的li 的class 传递过来1 就改变第一条li 传递过来二 就改变2 ,前提是不能用jquery 必须用原生的JS 展开
2013-11-28
展开全部
<nav>
<div id="nav">
<ul id="MainNav">
<li class="" onmouseover="one(1);"><a href="A">A</a></li>
<li class="" onmouseover="one(2);"><a href="B">B</a></li>
</ul>
</div>
<ul id="SunNav">
<li class="" > <a href="a">a</a></li>
<li class=""> <a href="b">b</a></li>
</ul>
<!-- 在页面中直接调用,注意id和class为字符串 -->
<input type="button" value="更改" onClick="one('MainNav',1,'123')"/>
</nav>
<script type="text/javascript">
/**
* 通过数字,改变class名称
* idName 需要修改的li的父级id
* num 需要修改的li的位置(1代表第一个,2代表第二个,数量不得大于指定的id下的li的总数)
* className 改变后的class名
*/
function one(idName, num, className) {
var _li = document.getElementById(idName).getElementsByTagName("li");
_li[num-1].setAttribute("class",className);
}
// 函数中调用
one("SunNav",2,"456");
</script>
<div id="nav">
<ul id="MainNav">
<li class="" onmouseover="one(1);"><a href="A">A</a></li>
<li class="" onmouseover="one(2);"><a href="B">B</a></li>
</ul>
</div>
<ul id="SunNav">
<li class="" > <a href="a">a</a></li>
<li class=""> <a href="b">b</a></li>
</ul>
<!-- 在页面中直接调用,注意id和class为字符串 -->
<input type="button" value="更改" onClick="one('MainNav',1,'123')"/>
</nav>
<script type="text/javascript">
/**
* 通过数字,改变class名称
* idName 需要修改的li的父级id
* num 需要修改的li的位置(1代表第一个,2代表第二个,数量不得大于指定的id下的li的总数)
* className 改变后的class名
*/
function one(idName, num, className) {
var _li = document.getElementById(idName).getElementsByTagName("li");
_li[num-1].setAttribute("class",className);
}
// 函数中调用
one("SunNav",2,"456");
</script>
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
function one(val){
var t = val-1;
document.getElementById("SunNav").children[t].className="sss";
}
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
function one( num )
{
var className = 'cls'; // 需要设置的class名
var sunNav = document.getElementById( 'SunNav' );
var lis = sunNav.children;
if( num && num <= lis.length )
{
lis[ num - 1 ].setAttribute( 'class', className );
}
}
{
var className = 'cls'; // 需要设置的class名
var sunNav = document.getElementById( 'SunNav' );
var lis = sunNav.children;
if( num && num <= lis.length )
{
lis[ num - 1 ].setAttribute( 'class', className );
}
}
本回答被网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
var ulObj=document.getElementById("MainNav");
var liList=ulObj.getElementsByTagName("li");
for(var i=0;i<liList.length;i++)
{
liList[i].style.className="class名称";
}
var liList=ulObj.getElementsByTagName("li");
for(var i=0;i<liList.length;i++)
{
liList[i].style.className="class名称";
}
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
var obj = document.getElementById("SunNax");
if(num == 1){
obj.className="newclassname";
}else{
}
if(num == 1){
obj.className="newclassname";
}else{
}
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询
广告 您可能关注的内容 |