jQuery - 設定內容和屬性
設定內容 - text()、html() 以及 val()
我們將使用前一章中的三個相同的方法來設定內容:
-
text() - 設定或返回所選元素的文字內容
-
html() - 設定或返回所選元素的內容(包括 HTML 標記)
-
val() - 設定或返回表單欄位的值
下面的例子演示如何透過 text()、html() 以及 val() 方法來設定內容:
$("#btn1").click(function(){ $("#test1").text("Hello world!"); }); $("#btn2").click(function(){ $("#test2").html("<b>Hello world!</b>"); }); $("#btn3").click(function(){ $("#test3").val("Dolly Duck"); });
text()、html() 以及 val() 的回撥函式
上面的三個 jQuery 方法:text()、html() 以及 val(),同樣擁有回撥函式。回撥函式有兩個引數:被選元素列表中當前元素的下標,以及原始(舊的)值。然後以函式新值返回您希望使用的字串。
下面的例子演示帶有回撥函式的 text() 和 html():
$("#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 + ")"; }); });
設定屬性 - attr()
jQuery attr() 方法也用於設定/改變屬性值。
下面的例子演示如何改變(設定)連結中 href 屬性的值:
$("button").click(function(){ $("#w3s").attr("href","//); });
attr() 方法也允許您同時設定多個屬性。
下面的例子演示如何同時設定 href 和 title 屬性:
$("button").click(function(){ $("#w3s").attr({ "href" : "//, "title" : "jQuery 教程" }); });
attr() 的回撥函式
jQuery 方法 attr(),也提供回撥函式。回撥函式由兩個引數:被選元素列表中當前元素的下標,以及原始(舊的)值。然後以函式新值返回您希望使用的字串。
下面的例子演示帶有回撥函式的 attr() 方法:
$("button").click(function(){ $("#w3cschool").attr("href", function(i,origValue){ return origValue + "/jquery"; }); });
來自 “ ITPUB部落格 ” ,連結:http://blog.itpub.net/70018483/viewspace-2907775/,如需轉載,請註明出處,否則將追究法律責任。
相關文章
- 010-jQuery獲取和設定內容屬性jQuery
- jQuery - 獲取內容和屬性jQuery
- jquery js 設定 div 的內容,給 div 新增一個屬性jQueryJS
- jQuery捕獲-獲取DOM元素內容和屬性jQuery
- Jquery如何獲取和設定元素內容?jQuery
- jquery設定和獲取元素的屬性jQuery
- jQuery—頁面內容,樣式,控制屬性jQuery
- jquery設定href屬性值jQuery
- jQuery設定disabled屬性與移除disabled屬性jQuery
- jquery實現的設定指定元素的文字內容和html內容jQueryHTML
- 行內元素屬性設定
- 如何為要被列印的內容設定CSS樣式屬性CSS
- jQuery如何設定元素的屬性值jQuery
- jQuery動態建立html元素並設定屬性jQueryHTML
- jQuery使用css()方法設定元素的display屬性值jQueryCSS
- jquery如何設定帶有important的樣式屬性jQueryImport
- jQuery css()設定和獲取元素css屬性值程式碼例項jQueryCSS
- 【打包1】內容、嵌入資源等檔案的生成操作,屬性如何設定
- C#反射設定屬性值和獲取屬性值C#反射
- 表屬性設定
- JavaScript設定屬性JavaScript
- jQuery建立一個元素同時設定元素的屬性jQuery
- Python的tkinter獲取元件屬性和設定元件屬性Python元件
- jQuery 屬性jQuery
- jQuery屬性jQuery
- CSS內聯樣式的使用,設定字型屬性CSS
- 帝國cms標題設定了加粗、顏色等屬性在內容頁顯示
- 設定和獲取元素固有屬性值
- Python 訪問和設定私有屬性Python
- Cookie設定HttpOnly屬性CookieHTTP
- jQuery length屬性jQuery
- js堅持不懈之15:修改html內容和屬性的方法JSHTML
- jQuery事件物件event的屬性和方法jQuery事件物件
- Echarts中Option屬性設定Echarts
- 執行緒屬性設定執行緒
- javascript實現的設定和獲取元素屬性JavaScript
- Xcode設定自己的個性屬性XCode
- AppTheme屬性設定集合APP