免费观看又色又爽又黄的小说免费_美女福利视频国产片_亚洲欧美精品_美国一级大黄大色毛片

怎么在jQuery中設置內容和屬性-創新互聯

怎么在jQuery中設置內容和屬性？很多新手對此不是很清楚，為了幫助大家解決這個難題，下面小編將為大家詳細講解，有這方面需求的人可以來學習下，希望你能有所收獲。

成都創新互聯公司2013年成立，先為深圳等服務建站，深圳等地企業，進行企業商務咨詢服務。為深圳企業網站制作PC+手機+微官網三網同步一站式服務解決您的所有建站問題。

一、設置內容以及回調函數

方法

  1. text() - 設置或返回所選元素的文本內容

  2. html() - 設置或返回所選元素的內容（包括 HTML 標記）

  3. val() - 設置或返回表單字段的值

例子

$("#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 + ")";
 });
});//返回元素內容

TIPS

回調函數由兩個參數：被選元素列表中當前元素的下標，以及原始（舊的）值。然后以函數新值返回您希望使用的字符串。

二、設置屬性以及回調函數

方法

attr() - 設置屬性值

例子

$("button").click(function(){
 $("#w3s").attr("href","http://www.w3school.com.cn/jquery");
});//設置單個屬性

$("button").click(function(){
 $("#w3s").attr({
  "href" : "http://www.w3school.com.cn/jquery",
  "title" : "W3School jQuery Tutorial"
 });
});//設置多個屬性
$("button").click(function(){
 $("#w3s").attr("href", function(i,origValue){
  return origValue + "/jquery";
 });
});//回調函數

總代碼

<!doctype html>
	<head>
	<title>jq設置內容和屬性</title>
	<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.0.js"></script>
	<script type="text/javascript">
		$(document).ready(function(){
			$("#bt1").click(function(){
				$("#p1").text("hello world1!");
			});
			$("#bt2").click(function(){
				$("#p2").html("<h2>hello world2!</h2>");
			});
			$("#bt3").click(function(){
				$("#t1").val("hello world3!");
			});
			$("#bt4").click(function(){
				$("#p1").text(function(i,origText){
					return "舊文本："+origText+"新文本：這是新文本(index:"+i+")"
				});
			});
			$("#bt5").click(function(){
				$("#p2").html(function(i,origText){
					return "舊HTML："+origText+"新HTML：<b>這是新HTML</b>(index:"+i+")"
				});
			});
			$("#bt6").click(function(){
				$("#t1").val(function(i,origText){
					return "舊值："+origText+"新值：這是新值(index:"+i+")"
				});
			});
			$("#bt7").click(function(){
				$("a").attr("href","https://tieba.baidu.com");
			});
			$("#bt8").click(function(){
				$("a").attr("href",function(i,origValue){return origValue + "/s?wd=1&rsv_spt=1&rsv_iqid=0xbc3b96600002e5f4&issp=1&f=8&rsv_bp=1&rsv_idx=2&ie=utf-8&tn=baiduhome_pg&rsv_enter=1&rsv_sug3=2&rsv_sug1=1&rsv_sug7=100&rsv_sug2=0&inputT=163&rsv_sug4=1686"});
			});
		});
	</script>
	</head>

	<body>
		<input type="button" id="bt1" value="設置文本" "">
		<input type="button" id="bt2" value="設置HTML" "">
		<input type="button" id="bt3" value="設置值" "">
		<p id="p1">這是文本</p>
		<p id="p2">這是HTML</p>
		<p>這是：<input type="text" value="值" id="t1" style ="width:500px"></p>
		<input type="button" id="bt4" value="顯示舊/新文本" "">
		<input type="button" id="bt5" value="顯示舊/新HTML" "">
		<input type="button" id="bt6" value="顯示舊/新值" "">
		<hr><!--以上是設置內容，一下是設置屬性-->
		<input type="button" id="bt7" value="改變href值為貼吧" "">
		<p><a id="baidu" href="https://www.baidu.com" rel="external nofollow" target="_blank">百度</a></p>
		<input type="button" id="bt8" value="改變href值為搜索1（回調函數）" "">
	</body>
</html>
jquery是什么

jquery是一個簡潔而快速的JavaScript庫，它具有獨特的鏈式語法和短小清晰的多功能接口、高效靈活的css選擇器，并且可對CSS選擇器進行擴展、擁有便捷的插件擴展機制和豐富的插件，是繼Prototype之后又一個優秀的JavaScript代碼庫，能夠用于簡化事件處理、HTML文檔遍歷、Ajax交互和動畫，以便快速開發網站。

看完上述內容是否對您有幫助呢？如果還想對相關知識有進一步的了解或閱讀更多相關文章，請關注創新互聯行業資訊頻道，感謝您對創新互聯的支持。

本文標題：怎么在jQuery中設置內容和屬性-創新互聯
本文網址：http://m.newbst.com/article8/hjjop.html

成都網站建設公司_創新互聯，為您提供定制開發、ChatGPT、App開發、虛擬主機、標簽優化、云服務器

廣告

聲明：本網站發布的內容（圖片、視頻和文字）以用戶投稿、用戶轉載內容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網站立場，如需處理請聯系客服。電話：028-86922220；郵箱：631063699@qq.com。內容未經允許不得轉載，或轉載時需注明來源： 創新互聯

成都網頁設計公司