jQuery修改標籤的text顯示內容或value值
阿新 • • 發佈:2018-12-29
修改常見標籤元素:超連結<a></a>標籤、<span>標籤、<div>標籤以及form表單常用input標籤內容。
附原始碼下載:原始碼下載。<html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>jquery 測試</title> <script type="text/javascript" src="jquery-1.8.3.min.js"></script> </head> <body> <div> jquery修改a標籤的href連結和文字,先點選下面連結<br />然後點選"改變"按鈕,然後再點選一次下面的連結,注意兩次開啟頁面的不同:<br /> A<a href="http://i.firefoxchina.cn/" id="a1">原文</a> <input type="button" value="改變A" id="a11" /><p></p> Span<span id="span1">原文</span> <input type="button" value="改變span" id="span11" /><p></p> Div<div id="div1" target="_blank">原文</div> <input type="button" value="改變DIV" id="div11" /> </div> <p></p> input<input type="text" name="text1" id="text1" value="111"> <input type="button" value="改變input" id="text11" /><p></p> textarea <input type="textarea" name="textarea1" id="textarea1" value="111"> <input type="button" value="改變textarea" id="textarea11" /><p></p> <input type="button" value="改變button" id="button11" /><p></p> <script type="text/javascript"> $("#a11").bind("click", function (){ $('#a1').attr('href','http://www.baidu.com'); alert("改變了超連結連結地址") $("#a1").text('首頁1'); alert("改變顯示的內容1") $("#a1").html('首頁2'); alert("改變顯示的內容2") }) $("#span11").bind("click", function (){ $("#span1").html('首頁'); alert("改變顯示內容") $("#span1").text('首頁'); }) $("#div11").bind("click", function (){ $("#div1").html('首頁1'); alert("改變顯示內容1") $("#div1").text('首頁2'); alert("改變顯示內容2") }) $("#text11").bind("click", function (){ $("#text1").val('首頁'); }) $("#textarea11").bind("click", function (){ $("#textarea1").val('首頁'); }) $("#button11").bind("click", function (){ $("#button11").val('首頁'); }) </script> </body> </html>
解壓後用瀏覽器開啟即可。