jquery常用基础方法

boyanx2个月前技术教程8

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 事件

标签: jquery库

相关文章

15个最棒的JavaScript图形/图表库

本文来自Coder信息网,有删减。几乎所有的控制面板都会用到图表,它们能够快速有效的展示复杂的统计。此外,一个好的图也可以提高你的网站的整体设计。这篇文章为大家展示一些最好的JavaScript图形/...

深圳嘉华学校:什么是JQuery?

什么是JQuery?这里将由北大青鸟深圳嘉华来介绍下关于JQuery部分知识,希望能让大家对JQuery有初步的映象。JQuery是继prototype之后又一个优秀的Javascript库。它是轻量...

day57:jQuery事件

链式操作<p>111</p> <p>222</p> """一行代码将第一个p标签变成红色第二个p标签变成绿色""...

Strip JS – 响应式的 Lightbox 效果

Strip 是一个灯箱效果插件,显示的时候只会覆盖部分的页面,这使得侵扰程度较低,并留出了空间与页面上的大屏幕,同时给予小型移动设备上的经典灯箱体验。Strp JS 基于 jQuery 库实现,支持所...

腾讯大佬私人收藏,GitHub上最受欢迎的100个JAVA库,值得学习

博客前言Java的经久不衰,很大程度上得益于Java的生态好。在日常开发中,我们也会经常使用到各种开源库和工具类,为了避免重复造轮子,本文将贴出工作及学习中会用到的部分开源库和工具类。Java的生态实...

这三个精巧且很棒 JS 库,值得你亲手试试

在本文中,介绍3个鲜为人知,但功能非常强大且体积很小的 JavaScript 库,这些可以帮助提高开发效率,减轻开发难度,让你加班少少的,请收纳。Basket.js网址: https://addyos...

发表评论    

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。