| |
|
开发:
C++知识库
Java知识库
JavaScript
Python
PHP知识库
人工智能
区块链
大数据
移动开发
嵌入式
开发工具
数据结构与算法
开发测试
游戏开发
网络协议
系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程 数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁 |
-> JQuery教程 -> jQuery 设置内容和属性 -> 正文阅读 |
|
[JQuery教程]jQuery 设置内容和属性 |
jQuery - 设置内容和属性设置内容 - text()、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("RUNOOB");
});
尝试一下 ? text()、html() 以及 val() 的回调函数上面的三个 jQuery 方法:text()、html() 以及 val(),同样拥有回调函数。回调函数有两个参数:被选元素列表中当前元素的下标,以及原始(旧的)值。然后以函数新值返回您希望使用的字符串。 下面的例子演示带有回调函数的 text() 和 html(): 实例$("#btn1").click(function(){
$("#test1").text(function(i,origText){
return "旧文本: " + origText + " 新文本: Hello world! (index: " + i + ")";
});
});
$("#btn2").click(function(){
$("#test2").html(function(i,origText){
return "旧 html: " + origText + " 新 html: Hello <b>world!</b> (index: " + i + ")";
});
});
尝试一下 ? 设置属性 - attr()jQuery attr() 方法也用于设置/改变属性值。 下面的例子演示如何改变(设置)链接中 href 属性的值: 实例$("button").click(function(){
$("#runoob").attr("href","http://www.runoob.com/jquery");
});
尝试一下 ? attr() 方法也允许您同时设置多个属性。 下面的例子演示如何同时设置 href 和 title 属性: 实例$("button").click(function(){
$("#runoob").attr({
"href" : "http://www.runoob.com/jquery",
"title" : "jQuery 教程"
});
});
尝试一下 ? attr() 的回调函数jQuery 方法 attr(),也提供回调函数。回调函数有两个参数:被选元素列表中当前元素的下标,以及原始(旧的)值。然后以函数新值返回您希望使用的字符串。 下面的例子演示带有回调函数的 attr() 方法: 实例$("button").click(function(){
$("#runoob").attr("href", function(i,origValue){
return origValue + "/jquery";
});
});
尝试一下 ? |
|
JQuery教程 最新文章 |
jQuery 树型菜单插件(Treeview) |
jQuery Tooltip |
jQuery Prettydate |
jQuery Password Validation(密码验证) |
jQuery Growl 插件(消息提醒) |
jQuery Autocomplete |
jQuery 选择器 |
jQuery 链 |
jQuery 事件方法 |
jQuery 实例 |
|
上一篇文章 下一篇文章 查看所有文章 |
|
开发:
C++知识库
Java知识库
JavaScript
Python
PHP知识库
人工智能
区块链
大数据
移动开发
嵌入式
开发工具
数据结构与算法
开发测试
游戏开发
网络协议
系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程 数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁 |
360图书馆 购物 三丰科技 阅读网 日历 万年历 2024年11日历 | -2024/11/22 19:45:55- |
|
网站联系: qq:121756557 email:121756557@qq.com IT数码 |