
jquery简单使用(看教程:快全有实例)(固定样式:$().val()设置属性,$().click()设置方法)
一、总结
1、jquery不懂之处直接看教程,案例都有,有简单又快
2、jquery给input设置值半天没弄出来,因为使用格式错误啊:本来应该是:$("#username").val("student"); 写成了$("#username").val="student";
3、jquery格式:$().()形式,$().val()设置属性,$().click()设置方法,全部是这样的形式,想清楚了怎么可能写错嘛
4、jquery都是放在ready函数中的
5、jquery不管是取值还是设置内容,格式都是$().()形式,所以所jquery很简单嘛
二、jquery简单使用
1、文档就绪函数
您也许已经注意到在我们的实例中的所有 jQuery 函数位于一个 document ready 函数中:
$(document).ready(function(){ --- jQuery functions go here ---- });
这是为了防止文档在完全加载(就绪)之前运行 jQuery 代码。
如果在文档没有完全加载之前就运行函数,操作可能失败。下面是两个具体的例子:
- 试图隐藏一个不存在的元素
- 获得未完全加载的图像的大小
2、获得内容 - text()、html() 以及 val()
三个简单实用的用于 DOM 操作的 jQuery 方法:
- text() - 设置或返回所选元素的文本内容
- html() - 设置或返回所选元素的内容(包括 HTML 标记)
- val() - 设置或返回表单字段的值
下面的例子演示如何通过 jQuery text() 和 html() 方法来获得内容:
$("#btn1").click(function(){
alert("Text: " + $("#test").text());
});
$("#btn2").click(function(){
alert("HTML: " + $("#test").html());
});
3、设置内容 - 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");
});