zoukankan      html  css  js  c++  java
  • jQuery的一些特性和用法

    下面简单介绍一下jQuery的一些特性和用法:

    1.精准简单的选择对象(dom):

     

     

    2.对象函数的应用简单和不限制:

     

     

    3.对已选择对象的操作(包括样式):

     

    $("#element").addClass("selected");//给对象添加样式
    $('#element').css({ "background-color":"yellow", "font-weight":"bolder" });//改变对象样式
    $("p").text("Some new text.");//改变对象文本
    $("img").attr({ src: "test.jpg", alt: "Test Image" });//改变对象文本
    $("p").add("span");//给对象增加标签
    $("p").find("span");//查找对象内部的对应元素
    $("p").parent();//对象的父级元素
    $("p").append("<b>Hello</b>");//给对象添加内容

    4.支持aJax,支持文件格式:xml/html/script/json/jsonp

     

    $("#feeds").load("feeds.html");//相应区域导入静态页内容
    $("#feeds").load("feeds.php", {limit: 25}, function(){alert("The last 25 
    entries in the feed have been loaded");});
     //导入动态内容

    5.对事件的支持:

     

    $("p").hover(function () {
    $(
    this).addClass("hilite");//鼠标放上去时
    }, function () {
    $(
    this).removeClass("hilite");//移开鼠标
    });//鼠标放上去和移开的不同效果(自动循环所有p对象)

    6.动画:

     

    $("p").show("slow");//隐藏对象(慢速渐变)
    $("#go").click(function(){
    $(
    "#block").animate({
    "90%",
    height:
    "100%",
    fontSize:
    "10em"
    },
    1000 );
    });
    //鼠标点击后宽、高、字体的动态变化

    7.扩展:

     

    $.fn.background = function(bg){
    return this.css('background', bg);
    };
    $(#element).background(
    "red");

    如果要为每一个jQuery 对象添加一个函数,必须把该函数指派给 $.fn,同时这个函数必须要返回一个 this(jQuery 对象)

    element.function(par);

    $(”p.surprise”).addClass(”ohmy”).show(”slow”)...
    $('#element');// 相当于document.getElementById("element")

    $(
    '.element');//Class
    $('p');//html标签
    $("form > input");//子对象
    $("div,span,p.myClass");//同时选择多种对象
    $("tr:odd").css("background-color", "#bbbbff");//表格的隔行背景
    $(":input");//表单对象
    $("input[name='newsletter']");//特定的表单对象
  • 相关阅读:
    diary and html 文本颜色编辑,行距和其它编辑总汇
    bash coding to changeNames
    virtualbox ubuntu 网络连接 以及 连接 secureCRT
    linux 学习6 软件包安装
    linux 学习8 权限管理
    vim 使用2 转载 为了打开方便
    ubuntu
    linux 学习15 16 启动管理,备份和恢复
    linux 学习 14 日志管理
    linux 学习 13 系统管理
  • 原文地址:https://www.cnblogs.com/liugang/p/1646735.html
Copyright © 2011-2022 走看看