<head>
<title>测试</title>
<script src="http://apps.bdimg.com/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
function add(){
//获得div1的宽
var width=$("#div1").css("width").replace("px","")
//获得div1的高
var height=$("#div1").css("height").replace("px","")
//在div1之后增加
$("#div1").after("<div style='float:leftwidth:"+(parseInt(width)+38)+"pxheight:"+(parseInt(height)+38)+"pxborder:1px solid bluemargin-top:5px'></div>")
}
</script>
</head>
<body>
<div style="width:50pxheight:50pxborder:1px solid blue" id="div1"></div>
<br/>
<input type="button" name="test" id="test" value="CESHI" onclick="add()"></input>
</body>
</html>
使用attr()或prop()方法为id属性赋值即可,关键代码$(obj_div).attr('id',id_name)
$(obj_div).prop('id',id_name)
实例演示如下:点击按钮设置div标签的id为test,为了便于观察效果,css中设置了id为test的样式为红色
1、HTML结构
<style>
#test{color:red !importantfont-weight:bold}
</style>
<div>我是示例DIV</div>
<input type="button" value="设置上一个div的id为test">
2、jquery代码
$(function(){
$("input:button").click(function() {
$(this).prev("div").attr("id","test")
})
})
css是控制style的,不能对HTML中的节点进行 *** 作的。如果你一定要用css来加入一个div(或许你整个站点中只能修改css文件)
只有一个办法可以试试
那就是试用css中的expression来加入javascript代码。
虽然它不符合W3C的标准,但是现在绝大部分浏览器还是支持的。
至于具体是试用方法你可以网上找一下,有很多
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)