jquery的基本使用(2)

在jquery重要的主干就是选择器和事件,其他的所有操作都是基于这两者来进行操作的。

jquery选择器

选择器就类似我们之前讲的getElementById之类的,就是查找dom中的某个元素。在jquery中,我们可以很简单的就能选择到我们想操作的dom元素。

复制代码
$(function(){
    var dom = $("#container_id").html();
    console.log(dom);
    dom = $("#container_id").text();
    console.log(dom);
    dom = $(".container_class:eq(0)");
    console.log(dom.text());
    console.log(dom.html());
});

注:

由以上可知,jquery的选择器很简单,只需要使用$("选择元素")就能获取到相关的dom,这里的"选择元素" 如果是id,需要加上id的#号标识,如果是class,就需要加上.的标识,:后接的是伪类选择器,就是满足某个条件的相应的元素,这里的eq就是等于的意思。

jquery事件

html中可以对各种元素添加事件,在jquery中想要对元素添加事件,需要先 选择 元素,然后使用事件。比如,我们点击container_id的元素就输出一段字符串:

复制代码
$(function(){
    var dom = $("#container_id");
    dom.click(function(){
        console.log("我输出了");
    });
});

注:

由以上可知dom元素添加事件,需要先选中,然后使用.事件名(function(){ 执行的函数 });就可以简单的进行添加。

相关推荐
wuhen_n几秒前
KeepAlive:组件缓存实现深度解析
前端·javascript·vue.js
前端付豪2 分钟前
Nest 项目小实践之图书展示和搜索
前端·node.js·nestjs
wuhen_n3 分钟前
Vue Router与响应式系统的集成
前端·javascript·vue.js
FansUnion30 分钟前
用 AI 自动生成壁纸标题、描述和 SEO Slug
javascript
青青家的小灰灰34 分钟前
金三银四面试官最想听的 React 答案:虚拟 DOM、Hooks 陷阱与大型列表优化
前端·react.js·面试
HelloReader34 分钟前
深入理解 Tauri 架构与应用体积优化实战指南
前端
lemon_yyds35 分钟前
vue 2 升级vue3 : ref 和 v-model 命名为同名
前端·vue.js
codingWhat35 分钟前
小程序里「嵌」H5:一套完整可落地的 WebView 集成方案
前端·uni-app·webview
重庆穿山甲39 分钟前
Java开发者的大模型入门:Spring AI Alibaba组件全攻略(二)
前端·后端
光影少年41 分钟前
在 React 中,什么情况下需要用 useCallback 和 useMemo?它们的区别是什么?
前端·react.js·掘金·金石计划