当前位置: 首页 > news >正文

jQuery 语法

jQuery 语法

jQuery 语法是为 HTML 元素的选取编制的,可以对元素执行某些操作。

基础语法是:$(selector).action()

  • 美元符号定义 jQuery
  • 选择符(selector)“查询”和“查找” HTML 元素
  • jQuery 的 action() 执行对元素的操作

示例

$(this).hide() - 隐藏当前元素

$("p").hide() - 隐藏所有段落

$(".test").hide() - 隐藏所有 class="test" 的所有元素

$("#test").hide() - 隐藏所有 id="test" 的元素

文档就绪函数

您也许已经注意到在我们的实例中的所有 jQuery 函数位于一个 document ready 函数中:

$(document).ready(function(){

--- jQuery functions go here ----

});

这是为了防止文档在完全加载(就绪)之前运行 jQuery 代码。

语法

 描述
$(this)当前 HTML 元素
$("p")所有 <p> 元素
$("p.intro")所有 class="intro" 的 <p> 元素
$(".intro")所有 class="intro" 的元素
$("#intro")id="intro" 的元素
$("ul li:first")每个 <ul> 的第一个 <li> 元素
$("[href$='.jpg']")所有带有以 ".jpg" 结尾的属性值的 href 属性
$("div#intro .head")id="intro" 的 <div> 元素中的所有 class="head" 的元素

jQuery 事件

下面是 jQuery 中事件方法的一些例子:

Event 函数绑定函数至
$(document).ready(function)将函数绑定到文档的就绪事件(当文档完成加载时)
$(selector).click(function)触发或将函数绑定到被选元素的点击事件
$(selector).dblclick(function)触发或将函数绑定到被选元素的双击事件
$(selector).focus(function)触发或将函数绑定到被选元素的获得焦点事件
$(selector).mouseover(function)触发或将函数绑定到被选元素的鼠标悬停事件

jQuery DOM 操作

  获得内容 - text()、html() 以及 val()

  • text() - 设置或返回所选元素的文本内容
  • html() - 设置或返回所选元素的内容(包括 HTML 标记)
  • val() - 设置或返回表单字段的值

     获取属性  

  • attr() 方法用于获取/设置/改变属性值
  • attr()允许同时设置多个属性

添加新的 HTML 内容

  • append() - 在被选元素的结尾插入内容
  • prepend() - 在被选元素的开头插入内容
  • after() - 在被选元素之后插入内容
  • before() - 在被选元素之前插入内容

删除元素/内容

  • remove() - 删除被选元素(及其子元素)
  • empty() - 从被选元素中删除子元素

jQuery 操作 CSS

  • addClass() - 向被选元素添加一个或多个类
  • removeClass() - 从被选元素删除一个或多个类
  • toggleClass() - 对被选元素进行添加/删除类的切换操作
  • css() - 设置或返回样式属性

  

转载于:https://www.cnblogs.com/pingjianga/p/6090752.html

相关文章:

  • 【FFMPEG】FFMPEG介绍
  • [原创软件]Maya语言切换工具
  • 【GoLang】GoLang 错误处理 -- 异常处理思路示例
  • Tower 实战一:MavLink的连接与通信
  • hive 数据清理--数据去重
  • rails生成器生成自定义controller模板
  • 关于适配器中设置显示与隐藏的问题
  • 递归的例子
  • 各种居中对齐
  • 面向对象 封装 、继承
  • [学习笔记]背包问题(一)
  • SQL 基础语法(一)
  • HTTP慢速DOS(slow http denial of service attack)
  • PAT甲题题解-1104. Sum of Number Segments (20)-(水题)
  • Java 8 Lambda表达式,让你的代码更简洁
  • Angular6错误 Service: No provider for Renderer2
  • JavaScript实现分页效果
  • Mysql5.6主从复制
  • 从setTimeout-setInterval看JS线程
  • 对象引论
  • 跨域
  • 理清楚Vue的结构
  • 如何合理的规划jvm性能调优
  • 深入浅出webpack学习(1)--核心概念
  • 数据库写操作弃用“SELECT ... FOR UPDATE”解决方案
  • 微信开源mars源码分析1—上层samples分析
  • 写代码的正确姿势
  • 一起参Ember.js讨论、问答社区。
  • 正则表达式小结
  • ​中南建设2022年半年报“韧”字当头,经营性现金流持续为正​
  • #ifdef 的技巧用法
  • #pragma 指令
  • #常见电池型号介绍 常见电池尺寸是多少【详解】
  • $(document).ready(function(){}), $().ready(function(){})和$(function(){})三者区别
  • $var=htmlencode(“‘);alert(‘2“); 的个人理解
  • (01)ORB-SLAM2源码无死角解析-(56) 闭环线程→计算Sim3:理论推导(1)求解s,t
  • (1)STL算法之遍历容器
  • (4.10~4.16)
  • (二)Linux——Linux常用指令
  • (紀錄)[ASP.NET MVC][jQuery]-2 純手工打造屬於自己的 jQuery GridView (含完整程式碼下載)...
  • (三)Hyperledger Fabric 1.1安装部署-chaincode测试
  • (算法)Travel Information Center
  • (一)ClickHouse 中的 `MaterializedMySQL` 数据库引擎的使用方法、设置、特性和限制。
  • (转)jdk与jre的区别
  • .class文件转换.java_从一个class文件深入理解Java字节码结构
  • .NET CF命令行调试器MDbg入门(一)
  • .NET 设计模式初探
  • .vue文件怎么使用_我在项目中是这样配置Vue的
  • ??javascript里的变量问题
  • @param注解什么意思_9000字,通俗易懂的讲解下Java注解
  • [.NET 即时通信SignalR] 认识SignalR (一)
  • [1181]linux两台服务器之间传输文件和文件夹
  • [bzoj 3534][Sdoi2014] 重建
  • [C#]winform制作圆形进度条好用的圆环圆形进度条控件和使用方法
  • [C++] 多线程编程-thread::yield()-sleep_for()