html标签切换代码求教

html标签切换代码求教,第1张

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/htmlcharset=gb2312" />

<title>无标题文档</title>

<script language="javascript" >

function showBox(item){

for(var i=1i<arguments.lengthi++){

document.getElementById("r_"+arguments[i]).style.display="none"

document.getElementById("n_"+arguments[i]).className="nr1"

}

document.getElementById("r_"+item).style.display="block"

document.getElementById("n_"+item).className="nr2"

}

</script>

<style type="text/css">

.nr1{background-color:#4A8BBFcolor:whitewidth:110pxheight:20pxline-height:19pxborder:1px solid #8FB7D7border-bottom:nonefont-weight:boldfont-size:14pxcursor:pointer}

.nr2{background-color:#EBF4FDcolor:#176AADwidth:110pxheight:20pxline-height:19pxborder:1px solid #8FB7D7border-bottom:nonefont-weight:boldfont-size:14pxcursor:pointer}

#cc{width: 230pxheight:255pxborder: 1px solid #183086background-color: #F1F8FDoverflow: hidden}

</style>

</head>

<body>

<div id="cc">

<table border="0" cellspacing="0">

<tr>

<td valign="bottom" align="center" >

<div class="nr2" id="n_wenzhan" onmouseover="showBox('wenzhan','redian')" >最新文章</div></td>

<td valign="bottom" align="center">

<div class="nr1" id="n_redian" onmouseover="showBox('redian','wenzhan')">热门点击</div></td></tr>

<tr><td height="230">

<div id="r_wenzhan" style="display:block">

<ul style="margin:0pxpadding:0"><li style="overflow:hidden"><a href="#">内容一内容一</a> xxxx-xx-xx</li>

<li><a href="#">内容二内容二</a> xxxx-xx-xx</li>

<li><a href="#">内容三内容三</a> xxxx-xx-xx</li>

<li><a href="#">内容四内容四</a> xxxx-xx-xx</li>

<li><a href="#">内容五内容五</a> xxxx-xx-xx</li></ul>

</div>

<div id="r_redian" style="display:none">热门点击</div></td></tr></table>

</div>

</body>

</html>

不懂的+我Q:459348730

用js找到那个标签位置,先删除你要改的标签,然后在容器div下面新增你要改成的标签内容,下面使用jq演示一下,首先要引入jq文件才能进行一下 *** 作。

<div id="div"><input type="text" id="inp" /></div>

<div id="data">请输入要修改成的标签及内容:<input type="text" id="content" /></div>

<a href="#" onclick="alter()return false">修改标签</a>

<script>

function alter(){

var data = $("#content").val()

$("div").empty().append(data)

}

</script>


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/zaji/7274976.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-04-03
下一篇 2023-04-03

发表评论

登录后才能评论

评论列表(0条)

保存