返回顶部
首页 > 资讯 > 前端开发 > JavaScript >JQuery获取对象的方式介绍
  • 623
分享到

JQuery获取对象的方式介绍

2024-04-02 19:04:59 623人浏览 安东尼
摘要

一、引用 官网下载对应的Jquery版本文件,在需要用到jquery的地方,用script标签引入进来 <head> <script src="jquery-1.1

一、引用

官网下载对应的Jquery版本文件,在需要用到jquery的地方,用script标签引入进来

<head>
<script src="jquery-1.10.2.min.js"></script>
</head>

二、获取对象

获取元素包装集对象

	<body>
		<div id="div1">
			hello
		</div>
		<script type="text/javascript">
			//获取元素包装集对象
			var div1 = $("#div1");
			console.log(div1);
			console.log(div1[0].innerText);
		</script>
	</body>

DOM对象获取

通过document.getElementById("id属性值")获取

如果元素不存在,则获取的是null

	<body>
		<div id="div1">块级元素</div>
		<script type="text/javascript">
			//获取dom对象
			var divDom = document.getElementById("div1");
			var divDom2 = document.getElementById("div2");
			console.log(document.getElementById("div1"));
			console.log(divDom2);//null
		</script>
	</body>

Jquery包装集对象

$("#id属性值");获取

如果元素不存在,不会返回null,是一个空的结果集

	<body>
		<div id="div1">块级元素</div>
		<script type="text/javascript">
			//jquery包装集对象
			var divJquery = $("#div1");
			var divJquery2 = $("#div2");
			console.log(divJquery);
			console.log(divJquery2);
			console.log(divJquery.length);
			console.log(divJquery2.length);
		</script>
	</body>

Dom转换成jquery包装集对象

$("dom对象");将需要转换的内容(dom对象/标签体)放入$("内容")中

	<body>
		<div id="div1">块级元素</div>
		<script type="text/javascript">
           var divDom = document.getElementById("div1");
			//Dom转换成jquery包装集对象
			console.log($(divDom));
			var span = "<span>行内元素</span>";
			console.log($(span));
		</script>
	</body>

Jquery包装集对象转换成Dom

jquery对象[下标] 可以直接获取到其中的dom对象

	<body>
		<div id="div1">块级元素</div>
		<script type="text/javascript">
			//jquery包装集对象	转换成Dom
			var newDom = divJquery[0];
			console.log(newDom);
				
			$('#div1').each(function() {//遍历
				   console.log($(this));
				   console.log(this);
			});
			
		</script>
	</body>

到此这篇关于JQuery获取对象的文章就介绍到这了。希望对大家的学习有所帮助,也希望大家多多支持编程网。

--结束END--

本文标题: JQuery获取对象的方式介绍

本文链接: https://lsjlt.com/news/147484.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

猜你喜欢
  • JQuery获取对象的方式介绍
    一、引用 官网下载对应的jquery版本文件,在需要用到jquery的地方,用script标签引入进来 <head> <script src="jquery-1.1...
    99+
    2024-04-02
  • Java如何创建对象?五种方式介绍
    我们总是讨论没有对象就去new一个对象,创建对象的方式在我这里变成了根深蒂固的new方式创建,但是其实创建对象的方式还是有很多种的,不单单有new方式创建对象,还有使用反射机制创建对象,使用clone方法去创建对象,通过序列化和反序列化的方...
    99+
    2015-06-11
    java入门 Java 对象
  • Netty分布式从recycler对象回收站获取对象的方法
    本篇内容主要讲解“Netty分布式从recycler对象回收站获取对象的方法”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“Netty分布式从recycler对象回收站获取对象的方法”吧!从对象回...
    99+
    2023-06-29
  • jquery获得事件源对象的方法
    在JQuery中,可以很方便地获得事件源对象。在事件处理函数中,可以通过传递事件对象(event)来获得事件源对象。另外,JQuery还提供了一个函数来获取事件源对象,即event.target。event.target和this的区别在事...
    99+
    2023-05-18
  • vue3中的对象时为proxy对象如何获取值(两种方式)
    目录第一种获取target值的方式:第二种获取target值PS:vue3中获取proxy包裹的数据前言一、具体问题二、解决办法使用vue3.0时,因为底层是使用proxy进行代理的...
    99+
    2023-01-28
    vue3 proxy对象获取值 vue3中获取proxy包裹的数据 vue3获取target值
  • js的math对象方法实例介绍
    本篇内容主要讲解“js的math对象方法实例介绍”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“js的math对象方法实例介绍”吧!Math对象方法//返回最大值...
    99+
    2024-04-02
  • jquery怎么根据属性值获取对象
    要根据属性值获取对象,可以使用jQuery的选择器方法。可以使用特定的属性选择器来选择具有特定属性值的元素。例如,如果要根据一个元素...
    99+
    2023-08-17
    jquery
  • C++获取文件大小数值的三种方式介绍
    目录方式一方式二方式三总结方式一 推荐使用此方式获得文件大小! C/C++、Window、Linux 环境都可以使用! 通过结构体struct stat获得。 需要包含头文件:#in...
    99+
    2024-04-02
  • Vue中的event对象介绍
    一、什么是event对象 event对象:代表的是事件的状态。比如获取当前的元素:e.Target。 二、事件冒泡 什么是事件冒泡呢?百度百科的解释如下: 当事件发生后,这个事件就要...
    99+
    2024-04-02
  • ASP.NETCore中的对象池介绍
    asp.net core中通过扩展库的方式提供给了一个标准的对象池ObjectPool,定义在Microsoft.Extensions.ObjectPool.dll 程序集中。它本身...
    99+
    2024-04-02
  • jquery获取值的方式有哪些
    jQuery有多种方式可以获取值,以下是一些常用的方法:1. .val():用于获取表单元素的值,如输入框、下拉框和单选框等。例:$...
    99+
    2023-08-11
    jquery
  • Jquery判断$("#id")获取的对象是否存在的方法
    一、判断对象对象是否存在 如果是下面的 jQuery 代码判断一个对象是否存在,是不能用的 复制代码 代码如下: if($("#id")){ }else{} 因为 $(“#id”)...
    99+
    2022-11-15
    Jquery 获取对象
  • Spring中获取Bean对象的注入方式有哪些
    本篇内容主要讲解“Spring中获取Bean对象的注入方式有哪些”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“Spring中获取Bean对象的注入方式有哪些”吧!前言获取 bean 对象也叫做对...
    99+
    2023-07-05
  • jquery怎么根据文本内容获取对象
    要根据文本内容获取对象,可以使用jQuery的选择器来实现。以下是一些常用的方法:1. 使用`:contains`选择器:可以通过包...
    99+
    2023-08-11
    jquery
  • JavaScript中的Array对象排序方法介绍
    这篇文章主要介绍“JavaScript中的Array对象排序方法介绍”,在日常操作中,相信很多人在JavaScript中的Array对象排序方法介绍问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方...
    99+
    2024-04-02
  • Vue路由参数的传递与获取方式详细介绍
    目录前言1. 通过动态路由参数传递2. 通过query字符串传递3. props 隐式传递前言 vue 页面路由切换时传参的方式有如下几种: 动态路由参数 它隐藏字段信息,相对于来说...
    99+
    2024-04-02
  • ReactHooks获取数据实现方法介绍
    目录前言useStateuseEffect获取数据前言 react16.8推出hooks更好的支持函数组件,使用函数组件更容易进行代码的复用,拓展性更强。 useState useS...
    99+
    2022-11-13
    React Hooks React Hooks获取数据
  • jquery获取input值的方式有哪些
    这篇文章主要介绍“jquery获取input值的方式有哪些”,在日常操作中,相信很多人在jquery获取input值的方式有哪些问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”...
    99+
    2024-04-02
  • jQuery样式操作方法整理介绍
    目录1.操作css方法2.设置样式类方法2.1添加类2.2移除类2.3切换类3.tab栏切换案例实现效果案例分析核心代码html结构4.jQuery类操作与className区别1....
    99+
    2022-11-13
    jQuery样式操作方法 jQuery样式操作函数 jQuery样式操作
  • JavaScript中的内置对象介绍
    一、对象的概念 对象是一种特殊的数据类型(object)。拥有一系列的属性和方法。分为内置对象和自定义对象。 二、String对象 String对象用来支持对于字符串的处理。 1、属...
    99+
    2024-04-02
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作