当前位置:编程学习 > JS >>

怎么对jquery里的html(0里的对象改变样式和其他操作呢,可以在html()里面用js,css吗?

<html xmlns="http://www.w3.org/1999/xhtml"> <head> <title> json </title> <script type="text/javascript" src="jquery-1.6.2.js"> </script> <style type="text/css"> .odd { background-color:#CCFF00; } .stl { border:thick; border-collapse:collapse; } </style> <script type="text/javascript"> $(function() { $("#Button1").click(function() { $.getJSON("UserInfo.json", function(data) { $("#divTip").empty(); var str="<table class='sortable' id='userinfo'><tbody><tr><td>Name</td><td>Sex</td><td>Email</td></tr>"; $.each(data, function(InfoIndex, Info){ str=str + "<tr><td>" + Info["name"] + "</td><td>" + Info["易做图"] + "</td><td>" + Info["email"] + "</td></tr>"; }); str = str + "</tbody></table>"; $("#divTip").append(str); }); }); }); $("body").find(".sortable tbody tr:odd").addClass('odd'); $("body").find(".sortable tr:even").addClass('even'); $("body").find("#divTip table").addClass('stl') </script> <style type="text/css"> .stl { border:thick; border-collapse:collapse; } </style> </script> </head> <body> <div class="divFrame"> <div class="divTitle"> <input id="Button1" type="button" class="btn" value="获取数据" /> </div> <div class="divContent"> <div id="divTip"> </div> </div> </div> <script type="text/javascript"> $("body").find(".sortable tbody tr:odd").addClass('odd'); $("body").find(".sortable tr:even").addClass('even'); $("#divTip").find("table").addClass('stl') </script> <style type="text/css"> #div table{ border:thick; } </style> </body> </html> 那些js和样式都没有用,要怎么改呢
追问:$("body").find(".sortable tbody tr:odd").addClass('odd');
 		$("body").find(".sortable tr:even").addClass('even');
		$("body").find("#divTip table").addClass('stl');	
还是没有实现……[
	{"name":"WJJ",
	 "易做图":"male",
	 "email":"wu@sina.com"
	},
	{"name":"LHF",
	 "易做图":"male",
	 "email":"lu@163.com"
	}
]我用$("#divTip").append(str); str  HTMLstring 生产了一个table,不行吗?
答案:如下修改
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title>
            json
        </title>
		<script type="text/javascript" src="jquery.js"></script>
		<style type="text/css">
			.odd {
				background-color:#CCFF00;
			}
			#div table{
				border:thick;
			}
			.stl {
				border:thick;
				border-collapse:collapse;
			}
		</style>
        
        <script type="text/javascript">
		$(function() {
	    $("#Button1").click(function() {
	        $.getJSON("UserInfo.json", function(data) {
	            $("#divTip").empty();
	            var str="<table class='sortable' id='userinfo'><tbody><tr><td>Name</td><td>Sex</td><td>Email</td></tr>";
		    $.each(data, function(InfoIndex, Info){
			str=str + "<tr><td>" + Info["name"] + "</td><td>" + Info["易做图"]  + "</td><td>" + Info["email"]  + "</td></tr>";
	            });
	            str = str + "</tbody></table>";
	            $("#divTip").append(str);
	        });
		$("body").find(".sortable tbody tr:odd").addClass('odd');
 		$("body").find(".sortable tr:even").addClass('even');
		$("body").find("#divTip table").addClass('stl');	
	});
});
		
		</script>  

    </head>
    
    <body>
        <div class="divFrame">
            <div class="divTitle">
                <input id="Button1" type="button" class="btn" value="获取数据" />
            </div>
            <div class="divContent">
                <div id="divTip">
                </div>
            </div>
        </div>
    </body>

</html>
其他:对象错了,#divTip 下面就没有table,你把里面的层次关系得搞清楚

上一个:哪里有好点的JS幻灯效果成品代码下载
下一个:js或者jquery 遍历Array([0]=>1,[1]=>3,[2]=>444)

CopyRight © 2022 站长资源库 编程知识问答 zzzyk.com All Rights Reserved
部分文章来自网络,