$(function(){
var url="http://api.flickr.com/services/feeds/photos_public.gne?tags=cat&tagmode=any&format=json&jsoncallback=?"
$.getJSON( //使用getJSON方法取得JSON数据
url,
function(data){ //处理数据 data指向的是返回来的JSON数据
var tit="<a href='"+ data.link +"'>"+data.title +"<\/a>"; //生成标题和标题连接
$("h1").html(tit); //出现在指定位置H1 内
$("#ginfo").find("p").eq(0).html(data.modified);
$("#ginfo").find("p").eq(1).html(data.generator);
var lis=""; //li 列表项目
$(data.items).each(function(i,ite){ //遍历JSON数据得到所需形式
lis+="<li>";
lis+="<a href='"+ ite.link +"'><img src='"+ite.media.m +"' title='"+ ite.title +"'><\/><\/a>";
lis+="<div>";
lis+=ite.description;
lis+="<\/div><\/li>";
})
$("ul").html(lis); //将翻译出来的数据呈现在所需位置
$("li").hover(function(){$(this).addClass("hov")}, function(){$(this).removeClass("hov")});
}
)
}) <script language="javascript" src="scripts/jquery.js"></script>
<script type="text/javascript">
$.ajax({
type: "GET",
url: "xxx.jsp",
dataType: "xml",
data: "fid=${param.fid}",
success: function(data) {
var name ="";
var content = "";
var date = "";
$(data).find('item').each(function(){
name = $(this).find('name').text();
content = $(this).find('content').text();
date = $(this).find('date').text();
这下面都是把解析后的xml赋值给界面
$('<li style="padding-bottom: 2px;padding-top: 2px;"></li>').html("<span class=spa>" +name + " </span>(" + date + ")<br/>" + content).appendTo('#content ol');
})
$(".stripe li").mouseover(function(){
$(this).addClass("over");}).mouseout(function(){
$(this).removeClass("over");})
$(".stripe li .spa").addClass("alt");
// $(".stripe li:even .spa").removeClass("alt1").addClass("alt");
}
});
</script>
$('').attr('') 这个方法可以获得获得属性
xxx.jsp 的代码
response.setContentType("text/XML");
out.print(xml);
我xml的格式：
<?xml version="1.0" encoding="utf-8"?>
<root>
<item>
<name>nick</name>
<date>2008-06-12 02:57:42</date>
<content>fsdfasdf</content>
</item>
</root> var lastPdSelect=$("select[name='pdLine']:last");
//复制一个select新对象
var newPdSelect=lastPdSelect.clone();
var index=lastPdSelect[0].selectedIndex;
//删除新对象里已经被选走的值
if(index>0){
newPdSelect[0].options.remove(index);
}
//添加新对象
newPdSelect.insertAfter(lastPdSelect);
<html>
<title>jquery</title>
<head>
<script type="text/javascript" src="jquery-1.4.2.js"></script>
</head>
<script type="text/javascript">
$(function(){
//alert($("#name").val());
//alert($("#user>.name").val());
//$("<div><p>Hello</p></div>").appendTo("body");
// $("<input type='checkbox'>").appendTo($("#fff"));
// $(document.body).css( "background", "black" );
//$("#fff").attr("action","test.do");fff
//$("<img></img>").attr("src","img/cd.gif").appendTo($("#"));
// $("img").each(function(i){this.src = "img/"+i + ".gif"; this.id="img"+i});
// alert($("img").attr("src"));
//alert($("img")[]);
// alert($(".name")[0].value);
//$("button").click(function () {
//$("div").each(function (index, domEle) {
// domEle == this
// $(domEle).css("backgroundColor", "yellow");
// if ($(this).is("#stop")) {
// $("span").text("Stopped at div index #" + index);
// return false;
// }
//});
//});
//alert($(document.body).height());
// var p = $("p:first");
//$("p:last").text( "innerWidth:" + p.innerWidth() );
//var p = $("p:first");
//$("p:last").text( "outerHeight:" + p.outerHeight() + " , outerHeight(true):" + p.outerHeight(true) );
//var p = $("p:first");
//$("p:last").text( "outerWidth:" + p.outerWidth() + " , outerWidth(true):" + p.outerWidth(true) );
//$("p").css({ color: "#ff0011", background: "blue" });
//$("p").css({ "margin-left": "10px", "background-color": "blue" });
//$("p").css("color","red");
// alert($("div").length);$("div").each(function(i){this.html('hhhhe'+i);return true;});
//alert($("#form1 input#name").val());
//alert( $("#radio1").attr("checked",""));
// $("#run").click(function(){
// $("#animate").animate({ right: "+=20" }, 1000);
//});
//$("#form1>input[name='check']:even").attr("checked",false);
// alert( $("#form1>input[name='check']:even").length);
//alert($("#form1>input[checked='checked']").length);
//alert($("#form1>input[checked!='checked']").length);
// checked.attr(checked,"");
// unchecked.attr(checked,"checked");
// alert($("input[checked='checked']").length);
// alert( $("#form1>input:checked").length );
//alert($("#form1>input[checked='true']").length);
// $("#form1>input[checked!=true]").attr("checked",true);
//var checked = $("#form1>input[checked=true]");
//var unchecked = $("#form1>input[checked!=true]");
//checked.attr("checked",false);
//unchecked.attr("checked",true);
//alert($("#form1>input:checked").length);
// $("[name='remark']").attr("disabled",true);
// alert($("#form1>[name='remark']").text());
// $("p").wrapAll($("<div></div>"));
// $("p").wrapAll(document.createElement("div"));
// $("p").replaceWith("<b>Paragraph. </b>");
// $("p").html("<b>Paragraph. </b>")
//alert($("p").not( $("#selected")[0] )[0]);
//alert($("p:first"));
//alert($("p:first").attr("class"));
//$("p:first").removeClass("first");
//alert($("p:first").attr("class"));
//alert($("#multiple option:selected").attr("index"));
//$("#filesubmit").click(
// function () {
// alert("in submit");
//alert( $("#file").text());
// alert( $("#file").val());
//alert(document.getElementById("file").value);
// var file = document.getElementById("file")
//$("#file").val("");
//file.value = "" firefox;
//file.setAttribute("value","");
//file.outerHTML=file.outerHTML;
//alert(file.outerHTML);
//file.outerHTML="<input type='file' id='file' />";
// alert(file.outerText);
// }
// );
var initcontent = new Array('a','b','c','d','e');
var sel2content ;
var sel3content ;
var initselect = $("<select></select>");
initselect.attr("id","sel1");
var sel1value;
var sel2value;
var sel2select =$("<select></select>");;
sel2select.attr("id","sel2");
var sel3select =$("<select></select>");;
sel3select.attr("id","sel3");
for(var i=0;i<initcontent.length;++i){
initselect.append("<option value="+initcontent[i]+">"+initcontent[i]+"</option>");
}
$(document.body).append(initselect);
$(document.body).append(sel2select);
$(document.body).append(sel3select);
$("#sel1").change( function(){
// alert(sel2select.attr("length"));
//sel2select.removeAttr("option");//clear last time content
// sel2select= $("<select></select>");
// sel2select.attr("id","sel2");
// alert($("#sel2 option").length);
//$("#sel2 option").each(function(){$(this).remove();});
//alert($("#sel2 option").length);
//alert($("#sel2").html());
$("#sel2").empty();
$("#sel3").empty();
// alert($("#sel2").html());
//$("#sel2").html("");
//$("#sel2 option").html("");
sel1value=$("#sel1").val();
// alert(sel1value);
sel2content = new Array();
for(var i=0;i<initcontent.length;++i){
if(sel1value!=initcontent[i]){
sel2content.push(initcontent[i]);
}
}
//alert(sel2content.length);
for(var i=0;i<sel2content.length;++i){
sel2select.append("<option value="+sel2content[i]+">"+sel2content[i]+"</option>");
}
}
);
$("#sel2").change( function(){
// alert(sel2select.attr("length"));
//sel2select.removeAttr("option");//clear last time content
//sel3select= $("<select></select>");
// sel3select.attr("id","sel3");
// sel3select.html("");
sel1value=$("#sel1").val();
// alert(sel1value);
sel2value=$("#sel2").val();
// alert(sel2value);
$("#sel3").empty();
// alert(sel1value);
sel3content = new Array();
// alert(initcontent.length);
for(var i=0;i<initcontent.length;++i){
// alert(i);
if(initcontent[i]!=sel1value && initcontent[i]!=sel2value){
alert(initcontent[i]);
sel3content.push(initcontent[i]);
}
}
//alert(sel2content.length);
for(var i=0;i<sel3content.length;++i){
sel3select.append("<option value="+sel3content[i]+">"+sel3content[i]+"</option>");
}
}
);
// alert($("p").html());
// $("p").empty();
// alert($("p").html());
// alert($("#multiple").html());
// $("#multiple").empty();
// alert($("#multiple").html());
});
</script>
<body>
<!-- <p>Hello, <span>Person</span> <a href="#">and person</a></p>
<p class="selected first">Hello</p>
<p>Hello</p><p id="selected">Hello Again</p>
<div class="protected">hheehhhehhe</div><div></div>
<p>Hello</p><p>cruel</p><p>World</p>
<p>I would like to say: </p>
<p>I would like to say: </p>
<b class="foo">Hello</b>
<b class="foo">Good Bye</b>
<button id="run">Run</button><div id="animate">heheh</div>
<p>Hello</p><p>2nd Paragraph</p>
<form id="form1">
<input type="text" vale="heheheheheh"/>
<input type="checkbox" name="check" value="1" />
<input type="checkbox" name="check" value="2" checked="checked" />
<input type="checkbox" name="check" value="3" />
<input type="checkbox" name="check" value="4" />
<input type="checkbox" name="check" value="5"/>
<textarea rows="3" cols ="50" name="remark" > teststestet</textarea>
<input type="file" id="file" />
<input type="button" value="提交" id="filesubmit"/>
<select><option/></select>
<textarea></textarea>
<button></button>
</form>
<button>Change colors</button>
<span></span>
<div></div>
<div></div>
<div></div>
<div></div>
<div id="stop">Stop here</div>
<div></div>
<select id="single">
<option>Single</option>
<option>Single2</option>
</select>
<select id="multiple" >
<option >Multiple</option>
<option>Multiple2</option>
<option selected="selected">Multiple3</option>
</select>
<!--
<div></div>
<div></div>
<form action= "" method="post" id="fff">
<div id = "user">
<img><img>
<input type = "text" class = "name" id = "name" value = "heeh"/>
<input type = "text" class = "name" id = "name1" value = "heeh2122"/>
</div>
</form>
-->
</body>
</html>
详细解决方案
jquery温习DEMO
热度：411 发布时间：2012-11-22 00:16:41.0
相关解决方案
- jquery 获取jsp页面的id解决方法
- jquery，二维数组取值。解决办法
- 求jquery.form.js+jquery.validate.min.js 用ajax提交表单的代码范例
- jquery 提交form表单不用插件的那种 如何提交
- jquery ajax回传没有值,该怎么处理
- jquery easyUI datagrid struts2有关问题
- jquery form 有关问题
- springmvc jquery ajax 提交复杂对象，415异常解决办法
- 应用Struts2 与 jquery,ajax验证用户注册,不用从数据库获取数据
- jquery ajax select解决方法
- php jquery check username ajax检察帐号唯一性
- jquery ajax返回值的有关问题
- jquery 或js 获取指定字符间的字符串，并轮换。回答出来的是大神级~
- jquery 的bind里面能不能获得返回值呢？ 对小弟我很难的有关问题啊
- jquery 的uploadify下传图片怎么让出错信息提示成中文
- java+jquery easy ui + json + struts分页例子
- jquery easyui分页效率有关问题
- jquery 如何获得动态添加后的子元素个数？
- jQuery.ajax（）请求struts2数据 回到data值了undefined
- 关于Struts2 jQuery Plugin的 Result,该如何处理
- Jquery 点击按钮实现图片翻页,该如何解决
- jquery 关于监听checkbox的选中和不选中事件,该如何解决
- jQuery append动态添加的页面对象如何处理刷新掉
- Jquery+json解决思路
- jquery post有关问题
- 求大神解决偏题 - jquery ajax
- jquery $.ajax有关问题
- jquery td遍历有关问题
- jquery ui taps有关问题，求解！
- jquery easyui 如何设置标题列居左，里面的数据列居右