JQuery 防身术

jQuery是一款优秀js开发库类,使我们写js变得更加方便,使我们开发效率更快。

<script type="text/javascript" src="/js/jquery-1.3.2.js"></script>

<script language="javascript" type="text/javascript">   
    $(document).ready(function(){
        $("a").click(function() {
        alert("Hello world!");
   });
});
<script>


$本身表示一个jQuery类,所有$()是构造一个jQuery对象,click()是这个对象的方法。 同理$(document)也是一个jQuery对象,ready(fn)$(document)的方法,表示当document全部下载完毕时执行函数。

DOM操作

1.对象获取

首先,平常使用最多的是一些JQuery的对象获取方法。有很多种,

譬如:

$("a") 是返回所有A标签 

$("#pId")  是返回 Id为“pId”的标签

$(".claName") 是返回class为“claName”的标签

$("*")  是返回文档内所有的标签元素

这个取元素是最直接的,最方便的,举一个简单的例子。

最少的代码做最多的事情, 这句话用在这里最经典的!

$("#cboMain").click(function(){

      $("input[name='cbo']").attr("checked",this.checked ); })

   取出复选框选中的集合
   注意写法:"[name='chkbox'][checked]" 不兼容 chrome,IE6浏览器可以
   function GetCboIds() {
            var ids = "";
            $('input[name="chkbox"]:checked').each(function () {
                ids += $(this).val() + ",";
            });
            if (ids == "") {
                alert("请选择项!");
                return;
            }
            return ids;
        }
  
全选,和 反选功能
function fnCheckAll(element)
        {
            $.each($('input[name="cboFiled"]'), function (i, v) {              
                if (element.checked){                  
                    this.checked = true;
                } else {
                    this.checked = false;
                }
            });
        }


获取一组radio被选中项的值

var sexVal = $("input:radio[name='suit'][checked]").val();

2.属性取值,和赋值。

$("#cboMain").attr("checked")  取出id为cboMain 的checked值

$("#cboMain").attr("checked",true)    修改属性值

$("#image").attr.removeAttr("src");

Class样式修改

$("p").addClass("selected");   添加,

$("p").removeClass("selected");  修改样式

$("#pContent").html("123")       //修改标签值 可包含(标签)

$("#pContent").text("123")        //修改标签值 不包含

$("#txt").val("I'm here! Don't look back, Let it go! ");

判断DIV是否隐藏:

    <div id="test" style="display: none">
    </div>

            var temp = $("#test").is(":hidden"); //是否隐藏
            var temp1 = $("#test").is(":visible"); //是否可见


            alert(temp);  //true


            alert(temp1); //false





3. 事件绑定

$('#foo').bind('click', function() {

  alert('User clicked on "foo."');

});

取消事件绑定

$("p").unbind( "click" )

AJAJ调用,

$.ajax({ url: "test.html", context: document.body, success: function(){

    $(this).addClass("done");

}});

$("#aAjax").load("UPAGE.aspx","参数",function(){}); 

循环数组:

$.each( ['a','b','c'], function( n,j){

       alert( "Item "+ ": " + n+"value:"+j);

       });    n为,索引,j为值

后来查找资料才发现,在each代码块内不能使用break和continue,要实现break和continue的功能的话,要使用其它的方式 
break----用return false; 
continue --用return ture;


判断一个值在数组中是否存在!

var arr = [ 4, "Pete", 8, "John" ];

jQuery.inArray("John", arr);  //3

jQuery.inArray(4, arr);  //0

jQuery.inArray("David", arr);  //-1

解析JSON 数据

var obj = jQuery.parseJSON('{"name":"John"}');

alert( obj.name === "John" );

使用JQuery加载HTML文件

    1.第一种方法
    $('#top_search').load('/search/Search.html');  //窗体加载查询页面

    2.第二种方法   

 $.get("/search/Search.html", function(data) {
$("#top_search").html(data);
});


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值