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(){ 执行的函数 });就可以简单的进行添加。

相关推荐
试图让你心动9 分钟前
【无标题】
前端·javascript·vue.js
Hilaku12 分钟前
为什么每个前端都应该拥有一个自己的独立博客?
前端·javascript·程序员
燕落南枝15 分钟前
CSS 后代选择器与子代选择器:从入门到实战
前端·css
Amos_Web18 分钟前
Rspack 源码解析(二十八):HtmlRspackPlugin 如何把模板变成带资源标签的最终产物
前端
马可家的菠萝21 分钟前
个人知识库怎么建?从一个正在学的技术主题开始
前端·笔记·知识管理·个人知识库
几何心凉21 分钟前
端到端具身交互智能正式上线:让 AI 通过屏幕和机器人,真正走进现实世界
前端·人工智能·实时互动·机器人·交互
木圭的AI时代指南28 分钟前
实测 MiniMax M3.1 Flash:同一道 Three.js 大题,两个 agent 差出 4.6 倍
开发语言·javascript·ecmascript
西红柿炖牛腩35433 分钟前
3D 模型压缩脚本又报错又配环境?换个不用维护的方案
javascript·3d·性能优化
tryCbest1 小时前
Vue3——第 6 篇:事件处理与表单绑定——v-on 与 v-model
前端·javascript·vue.js
恋猫de小郭1 小时前
Flutter 的文字为什么比 SwiftUI 更细?问题主要在 Skia 的 256 项查找表里
android·前端·flutter