网站首页 > 基础教程 正文
1 jQuery操作
1.1 引入jQuery
要使用jQueryjavascript库,只需要将jQuery 对应的“jquery-x.x.js”脚本文件引入到页面中即可。
<script type="text/javascript" src="js/jquery-1.11.3.js"></script> |
1.2 常用基础方法
1.2.1 初始事件
在未使用jQuery之前;在页面中常常需要用到window.onload来初始化一些元素事件。引入jQuery之后,它也对应有类似方法:ready;当DOM载入就绪可以查询及操纵时绑定一个要执行的函数;该方法是对向window.load事件注册事件的替代。两种写法:
写法一:直写 $(document).ready(function(){ // 在这里写你的代码... }); 写法二:$(document).ready() 的简写 $(function() { // 你可以在这里继续使用$作为别名... }); |
1.2.2 基本选择
用法 | 描述 |
$(“#elementID”) | #表示根据id查找;查找id为elementID的元素;建议的用法。所以一般推荐给标签设置ID。 类似: document.getElementById("elementID") 但两者之间返回类型不同 |
$(“.className”) | .表示根据class样式名称查找;查找样式名称为className的所有标签 |
$(“input”) | 查找所有input标签 |
1.2.3 基本取/设值
用法 | 描述 |
$(“#elementID”).val() $(“#elementID”).val(“新值”) | 分别表示取值和设置值 |
$(“#elementID”).html() $(“#elementID”).html(“新值”) | 分别表示获取标签内部的html文本内容和设置html文本内容。类似innerHTML |
$(“#elementID”).text() $(“#elementID”).text(“新值”) | 分别表示获取标签内部的纯文本内容和设置纯文本内容。 |
$(“#elementID”).attr(“name”) $(“#elementID”).attr(“name”,”itcast”) | attr为获取对应属性的值或设置对应属性的值。如果遇上具有 true 和 false 两个属性的属性,如 checked, selected 或者 disabled 则使用prop() |
1.2.4 基本访问与工具
用法 | 描述 |
empty() | 删除匹配的元素集合中所有的子节点。 |
each() | 以每一个匹配的元素作为上下文来执行一个函数;每次执行传递进来的函数时,函数中的this关键字都指向一个不同的DOM元素。 |
jQuery.each() | 通用例遍方法,可用于例遍对象和数组 |
jQuery.trim() | 去掉字符串起始和结尾的空格。 $.trim(" hello, how are you? ");去掉字符串起始和结尾的空格。 |
focus() | 定焦或当元素获得焦点时,触发 focus 事件 |
猜你喜欢
- 2024-11-25 React 与 虚拟DOM
- 2024-11-25 Vue 的这5个技巧,可以大大提高我们的构建体验
- 2024-11-25 全新web前端开发教程之Jquery事件
- 2024-11-25 JQuery 实现简易记事簿
- 2024-11-25 一波Ts 基础大全;领先同事的机会来了
- 2024-11-25 Python教程:报表和日志精讲
- 2024-11-25 「jQuery-3」 获取和设置标签元素
- 2024-11-25 jq中attr 设置checkbox 选中状态中的坑
- 2024-11-25 「B/S端开发」DevExtreme初级入门教程 - 支持TypeScript
- 2024-11-25 SpringBoot学习笔记八之Admin分配角色权限
- 最近发表
- 标签列表
-
- gitpush (61)
- pythonif (68)
- location.href (57)
- tail-f (57)
- pythonifelse (59)
- deletesql (62)
- c++模板 (62)
- css3动画 (57)
- c#event (59)
- linuxgzip (68)
- 字符串连接 (73)
- nginx配置文件详解 (61)
- html标签 (69)
- c++初始化列表 (64)
- exec命令 (59)
- canvasfilltext (58)
- mysqlinnodbmyisam区别 (63)
- arraylistadd (66)
- node教程 (59)
- console.table (62)
- c++time_t (58)
- phpcookie (58)
- mysqldatesub函数 (63)
- window10java环境变量设置 (66)
- c++虚函数和纯虚函数的区别 (66)