关于DOM和CSS的页面元素选择:

  $("span");     //全部span元素

  $("#elem");   //id为elem的元素

  $(".classname");  //类为classname的元素

  $("div#elem");  //id为elem的<div>元素

  $("ul li a.menu");  //类为”menu”的<a>标签

  $("p>span");  //p的直接子元素span

  $("input[type=password]");  //指定类型的input元素

  $("p:first");  //页面的第一个段落  

  $("p:even");  //全部偶数段落

  $(":header");  //标题元素(h1到h6)

  $(":button");  //全部按钮元素

  $(":radio");

  $(":checkbox");  

  $(":checked");   //选中状态的 选择框或段选框

  • html()  获取元素或者一组元素的HTML内容,类似与JavaScript的innerHTML,会获得全部的HTML(包括文本)。
var htmlContent=$("#elem").html();
$("#elem").html("<p>Here is some new content.</p>");
/*修改内容*/
  • text() 仅获取元素的文本内容,获取及修改内容如下:
1
2
3
var textContent=$("#elem").text();
$("#elem").text("new content");     //修改内容
$("#elem").append("<p>Here is some new content.</p>")   //添加文本内容
  • attr() 返回一个元素特定的属性值,当用于一组时,返回第一个元素的值。
1
2
3
var title=$("#elem").attr("title");    //返回属性值
 
$("#elem").attr("title","new title");    //修改属性值
  • show()    //显示元素     $("div").show();
  • hide()     //   隐藏元素  ,slow的值大约是600毫秒

     $("#elem").hide("slow",function(){

            //隐藏后的操作

         }); 


元素动画

  1.淡入淡出,如:

  $("#elem").fadeOut("slow",funtion(){

     //淡出后的操作

  });

  

  $("#elem").fadeIn(500,function(){

     //淡入后的操作  

  });

  

  $("#elem").fadeTo(3000,0.5,function(){

      //淡入或淡出后的操作,0.5表示不透明度,表示最终不透明度淡入或者淡出为0.5

  });

  2.滑动,类似淡入淡出

  slideDown();

  slideUp();

  slideToggle();

  3.动画

  animate()可以应用于很多的CSS样式。如把元素高度宽度改变后再淡出隐藏。

1
2
3
4
5
6
7
8
$("#elem").animate(
    {
        width:400px;
        height:400px;
       },1500,function(){
               $(this).fadeOut("slow");
                }
  );

 命令链 

  jQuery命令链的长度没有什么限制,可以对同一组元素连续进行很多的操作:

  $("#elem").text("Hello from jQuery").fadeOut().fadeIn();

JQuery能够高效地操作页面元素的更多相关文章

  1. 利用 jQuery 操作页面元素的方法,实现电商网站购物车页面商品数量的增加和减少操作,要求单项价格和总价随着数量的改变而改变

    查看本章节 查看作业目录 需求说明: 利用 jQuery 操作页面元素的方法,实现电商网站购物车页面商品数量的增加和减少操作,要求单项价格和总价随着数量的改变而改变 当用户单击"+" ...

  2. 使用 jQuery 操作页面元素的方法,实现浏览大图片的效果,在页面上插入一幅小图片,当鼠标悬停到小图片上时,在小图片的右侧出现与之相对应的大图片

    查看本章节 查看作业目录 需求说明: 使用 jQuery 操作页面元素的方法,实现浏览大图片的效果,在页面上插入一幅小图片,当鼠标悬停到小图片上时,在小图片的右侧出现与之相对应的大图片 实现思路: 在 ...

  3. Selenium with Python 005 - 调用js操作页面元素

    WebDriver提供了execute_script()方法来执行JavaScript方法,格式如 driver.execute_script(script,*args) 执行js一般有两种场景,一是 ...

  4. 使用javaScript操作页面元素

    from selenium import webdriver import time import unittest from selenium.common.exceptions import We ...

  5. selenium常用命令--操作页面元素及获取元素内容整理

    selenium常用命令之操作页面元素及获取元素内容的事件整理 例子:  /**id <input type="text" id="phone" name ...

  6. [Selenium] 操作页面元素等待时间

    WebDriver 在操作页面元素等待时间时,提供2种等待方式:一个为显式等待,一个为隐式等待,其区别在于: 1)显式等待:明确地告诉 WebDriver 按照特定的条件进行等待,条件未达到就一直等待 ...

  7. F12修改html进行本地js操作页面元素

    F12修改html进行本地js操作页面元素

  8. Java&Selenium调用JS实现高亮被操作页面元素高亮

    Java&Selenium调用JS实现高亮被操作页面元素高亮 /* * the method of invoking js to do something * * @author daviey ...

  9. juery学习总结(二)——juery操作页面元素

    所有的操作都可以分为增.删.改.查四种,juery选择器代表查看的功能,那么剩下的操作就是对页面元素增.删.改.页面元素有3部分构成:标签,属性和内容,juery对元素的操作可以从这3方面入手. 一. ...

随机推荐

  1. selenuim爬虫实战(日lofter.com)

    LOFTER是网易公司2011年8月下旬推出的一款轻博客产品. LOFTER专注于为用户提供简约.易用.有品质.重原创的博客工具.原创社区,以及有品质的手机博客应用. LOFTER首次采用独立域名,口 ...

  2. Fastcgi_Finish_Request 提高页面响应速度

    当PHP运行在FastCGI模式时,PHP FPM提供了一个名为fastcgi_finish_request的方法.按照文档上的说法,此方法可以提高请求的处理速度,如果有些处理可以在页面生成完后再进行 ...

  3. C++ 类的对象管理模型初讲

    //类的对象管理模型初讲 #include<iostream> using namespace std; class PointA{ private: int x;//占据4个字节大小的内 ...

  4. mysql存储过程,获取指定数据库的某个表的字段信息

    DROP PROCEDURE IF EXISTS Proc; DELIMITER //CREATE PROCEDURE Proc(database_name varchar(50),table_nam ...

  5. bootstrap基础学习四篇

    bootstrap代码 Bootstrap 允许两种方式显示代码: 第一种是 <code> 标签.如果您想要内联显示代码,那么您应该使用 <code> 标签. 第二种是 < ...

  6. 国际化信息-->MVC

    假设我们正在开发一个支持多国语言的Web应用程序,要求系统能够根据客户端的系统的语言类型返回对应的界面:英文的操作系统返回英文界面,而中文的操作系统则返回中文界面——这便是典型的i18n国际化问题.对 ...

  7. 在visual studio中运行C++心得

    1.在visual studio中建立C++项目 (1)新建->项目->空项目 C++ (2)右击项目->添加->新建项->C++文件(.app) (3编写C++文件   ...

  8. Json与数组

    今天趁着看源代码的同时,记录学习的小知识. 一.String.Split 方法有6个重载函数: 1) public string[] Split(params char[] separator)2) ...

  9. 匿名(无账号密码)从ftp服务器下载文件

    public static String downFile(String ip,String ftpFileName,String savePath,String fileName) { FTPCli ...

  10. UIWindow和UIScreen

    UIWindow和UIScreen 目录 概述 职责 实用操作 概述 UIWindow职责 包含了应用程序的可视化的内容 为视图和其他应用程序对象在触摸事件中提供了关键性的作用 与视图控制器一起协作来 ...