04 JQuery基础笔记

1.jquery文件包
官方网站:www.jquery.com
2.加载到网页
<script type="text/javascript" language="javascript" src="jquery-1.7.1.min.js"></script>

常用的方法

[调ID]
$("#id名")
相当于document.getElementById("id名")

[调class名称]
$(".class名称")

[调HTML标签]
$("div")
相当于document.getElementByTags("div")

[控制属性]
$("#id").attr("href",'链接的内容')
控制的是A标签的HREF内容
$("#id").attr('src','图片地址');
控制的是img标签的图片地址
注意:如果第二个参数没有,则表示的是获取这个属性值,比如$("#id").attr("href");可以得到当前的链接。也就是说,如果第二个参数存在就是在赋值,否则就是在取值。

[获取HTML元素内的内容]
$("#id").html();
[改变一个HTML元素的内部内容]
$("#id").html('这里写内容');
相当于document.getElementById("id").innerHTML = '这里写内容';
[只取HTML元素的内容,不要里面的HTML标签]
$("#id").text();

[取input表单值]
$("#id").val();

[控制CSS样式]
$("#id").css('属性名');取值
$("#id").css('color','red');赋值
$("p").css({ color: "#ff0011", background: "blue" }); 

[去除字符串两端空格]
$("#id").trim(JS的变量名称);
[判断一个变量是否为空]
$("#id").empty(); 

[删除一个class名称]
$("#id").removeClass('样式名');
[增加一个class名称]
$("#id").addClass('样式名');

[AJAX技术]
异步请求技术,不是JQUERY专有的内容,是JS的一个功能,jquery重新封装的ajax,对其兼容性做的比较完善
原理:首先发送一个请求给后端语言,即在服务器端运行的程序,服务器端接收到后,自己的程序运行完毕后会输出一些内容,这些东西就会自动返回回来给js处理。这就是AJAX的一个核心思想。是一种非常实用的无刷新技术。两个重要的方法

[get请求方式]
类似直接用地址栏去请求,即如同直接在地址输入网址后回车看到的页面内容。这个页面上能够显示出来的内容就会返回给下面的data变量。
$.get('网址(不支持跨域名网址)',function(data){
    js的语句
});

[post请求方式]
类似表单提交,也就是说像点击了SUBMIT按钮一样的效果。注意,最后一个参数值后面不要加逗号
$.post('网址(不支持跨域名网址)', {
    参数名:参数值,
    参数名:参数值
}, function(data){
    js的语句
});

$.ajax({
   type: "POST",
   url: "some.php",
   data: "name: "John", time: "2pm" ",
   success: function(msg){
     alert( "Data Saved: " + msg );
   }
});

 

posted @ 2013-06-03 15:46  Kiwi0921  阅读(157)  评论(0编辑  收藏  举报