标签:style blog http color java 使用 io strong
$("#btn1").click(function(){ alert("Text: " + $("#test").text()); }); $("#btn2").click(function(){ alert("HTML: " + $("#test").html()); });
$("#btn1").click(function(){ alert("Value: " + $("#test").val()); });
$("button").click(function(){ alert($("#Attr").attr("href")); });
$("#btn1").click(function(){ $("#test1").text("Hello world!"); }); $("#btn2").click(function(){ $("#test2").html("<b>Hello world!</b>"); }); $("#btn3").click(function(){ $("#test3").val("Dolly Duck"); });
$("#btn1").click(function(){ $("#test1").text(function(i,origText){ return "Old text: " + origText + " New text: Hello world! (index: " + i + ")"; }); }); $("#btn2").click(function(){ $("#test2").html(function(i,origText){ return "Old html: " + origText + " New html: Hello <b>world!</b> (index: " + i + ")"; }); });
$("button").click(function(){ $("#w3s").attr("href","http://www.csdn.net"); });
$(document).ready(function(){ $("button").click(function(){ $("#csdn").attr({ "href" : "http://www.csdn.net", "target" : "_blank" }); }); });
$("button").click(function(){ $("#csdn").attr("href", function(i,origValue){ return origValue + "/u014194675"; }); });提示:
<p><a href="http://blog.csdn.net" id="csdn">csdn</a></p>哈哈~
本来想学到这里就结束了,可是看看上面都是不完整的样例,练习起来可能不太方便,可是假设贴好几个小样例,看起来会非常乱吧。。。于是我总结了一个大样例。。。顺便能够放在我的网页中。。。。。。图片不想贴了。。。。。。附个链接吧,点击打开链接。
<!DOCTYPE html> <html> <head> <script src="jquery-1.11.1.js"></script> <script> $(document).ready(function(){ $("#btn1").click(function(){ alert("Text: " + $("#test1").text()); }); $("#btn2").click(function(){ alert("HTML: " + $("#test1").html()); }); $("#btn3").click(function(){ alert("Value: " + $("#test2").val()); }); $("#btn4").click(function(){ $("#test1").text("能够呀"); }); $("#btn5").click(function(){ $("#test1").html("<b>真的么</b>"); }); $("#btn6").click(function(){ $("#test2").val("周董"); }); $("#btn7").click(function(){ $("#test1").text(function(i, origText){ return (origText + " 应该能够吧"); }); }); $("#btn8").click(function(){ $("#test1").html(function(i, origText){ return (origText + " <b>好的</b>"); }); }); $("#btn9").click(function(){ $("#test2").val(function(i, origText){ return (origText + " Jay Chou"); }); }); $("#button1").click(function(){ alert($("#xyxy").attr("href")); }); $("#button2").click(function(){ $("#xyxy").attr({ "href" : "http://www.suxin.yeyou.eu", "target" : "view_frame" }); }); $("#button3").click(function(){ $("#xyxy").attr("href", function(i,origValue){ return origValue + "/answer.html"; }); }); }); </script> </head> <body> <p id="test1" value="csdn">我能够继续用<b>杰伦</b>来举样例么</p> <button id="btn1">显示文本</button> <button id="btn2">显示 HTML</button> <button id="btn4">设置文本</button> <button id="btn5">设置 HTML</button> <button id="btn7">回调函数设置文本</button> <button id="btn8">回调函数设置 HTML</button> <p>姓名:<input type="text" id="test2" value="周杰伦"></p> <button id="btn3">显示 value</button> <button id="btn6">设置 value</button> <button id="btn9">回调函数设置 value</button> <p><a href="http://www.suxin.yeyou.eu/test.html" target="_blank" id="xyxy">自己的网页</a></p> <button id="button1">获取 href</button> <button id="button2">设置 href 多个属性</button> <button id="button3">回调函数设置 href </button> <p>先点击链接;然后点击button2,再点击链接;之后再点击button3,再点击链接。</p> </body> </html>
JavaScript(19)jQuery HTML 获取和设置内容和属性,布布扣,bubuko.com
JavaScript(19)jQuery HTML 获取和设置内容和属性
标签:style blog http color java 使用 io strong
原文地址:http://www.cnblogs.com/yxwkf/p/3900780.html