document.getElementById()与 $()区别

document.getElementById()返回的是DOM对象,而$()返回的是jQuery对象

什么是jQuery对象? 
---就是通过jQuery包装DOM对象后产生的对象。jQuery对象是jQuery独有的,其可以使用jQuery里的方法。 
比如: 
$("#test").html() 意思是指:获取ID为test的元素内的html代码。其中html()是jQuery里的方法 
这段代码等同于用DOM实现代码: 
document.getElementById("id").innerHTML; 
虽然jQuery对象是包装DOM对象后产生的,但是jQuery无法使用DOM对象的任何方法,同理DOM对象也不能使用jQuery里的方法.乱使用会报错。比如:$("#test").innerHTML、document.getElementById("id").html()之类的写法都是错误的。 
还有一个要注意的是:用#id作为选择符取得的是jQuery对象与document.getElementById("id")得到的DOM对象,这两者并不等价。请参看如下说的两者间的转换。 
既然jQuery有区别但也有联系,那么jQuery对象与DOM对象也可以相互转换。在再两者转换前首先我们给一个约定:如果一个获取的是jQuery对象,那么我们在变量前面加上$,如:var $variab = jQuery对象;如果获取的是DOM对象,则与习惯普通一样:var variab = DOM对象;这么约定只是便于讲解与区别,实际使用中并不规定。 

jQuery对象转成DOM对象: 
两种转换方式将一个jQuery对象转换成DOM对象:[index]和.get(index); 
(1)jQuery对象是一个数据对象,可以通过[index]的方法,来得到相应的DOM对象。 
如:var $v =$("#v") ; //jQuery对象 
var v=$v[0]; //DOM对象 
alert(v.checked) //检测这个checkbox是否被选中 
(2)jQuery本身提供,通过.get(index)方法,得到相应的DOM对象 
如:var $v=$("#v"); //jQuery对象 
var v=$v.get(0); //DOM对象 
alert(v.checked) //检测这个checkbox是否被选中 

DOM对象转成jQuery对象: 
对于已经是一个DOM对象,只需要用$()把DOM对象包装起来,就可以获得一个jQuery对象了。$(DOM对象) 
如:var v=document.getElementById("v"); //DOM对象 
var $v=$(v); //jQuery对象 
转换后,就可以任意使用jQuery的方法了。 
通过以上方法,可以任意的相互转换jQuery对象和DOM对象。需要再强调注意的是:DOM对象才能使用DOM中的方法,jQuery对象是不可以用DOM中的方法。 

下面是其它的相关使用方法:
1、DOM对象转jQuery对象 
普通的Dom对象一般可以通过$()转换成jQuery对象。 

如:$(document.getElementById("msg")) 
返回的就是jQuery对象,可以使用jQuery的方法。 

2、jQuery对象转DOM对象 
由于jQuery对象本身是一个集合。所以如果jQuery对象要转换为Dom对象则必须取出其中的某一项,一般可通过索引取出。 
如: $("#msg")[0],$("div").eq(1)[0],$("div").get()[1],$("td")[5] 

这些都是Dom对象,可以使用Dom中的方法,但不能再使用jQuery的方法。 

以下几种写法都是正确的: 
$("#msg").html(); 
$("#msg")[0].innerHTML; 
$("#msg").eq(0)[0].innerHTML; 
$("#msg").get(0).innerHTML;

3、两种方法获取对象方式: 如有 <form name="formName"  id="formid"></form>

通过id:

  document.getElementById('formid');

  $('#formid')

通过name

  document.getElementsByName('formName')[0]

  $("form[name='formName']")

转载于:https://www.cnblogs.com/hujunzheng/p/4907482.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/531402.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

关于gedit的编码问题

今天由于gedit的编码格式导致LCD显示屏的问题&#xff0c;开始没有想到后来才发现&#xff0c;在这记录一下 #include <stdio.h> #include <unistd.h> #include <stdio.h> #include <fcntl.h> #include <linux/fb.h> #include <sys/mman.h>…

c语言表白程序代码

双十一要到了&#xff0c;好激动啊&#xff01;&#xff01;&#xff01; 是时候准备出手了&#xff01; 花了一天的时间写的表白代码。 表示自己弱弱的..... 看了网上好多都是js写的&#xff0c;感觉碉堡了&#xff01;js用的不熟&#xff0c;前端不好&#xff0c;java&#x…

tiny4412移植tslib库

1、将tslib-1.4.tar.gz拷贝到虚拟机某个路径进行解压 2、进入解压路径tslib 3、执行#./autogen.sh 如果提示&#xff1a;./autogen.sh: 4: ./autogen.sh: autoreconf: not found 原因&#xff1a;没有安装automake工具, 解决办法:需要安装此工具&#xff1a; apt-get instal…

移植QT到tiny4412开发板

目录&#xff08;一&#xff09; 环境准备&#xff08;二&#xff09; Qt源代码下载&#xff08;三&#xff09; 移植tslib库&#xff08;四&#xff09;操作流程1.解压qt源码包2.配置编译环境3.生成Makefile4.编译安装5.安装一些库用来支持 qt6. 添加以下内容到开发板目录下的…

c++面试常用知识(sizeof计算类的大小,虚拟继承,重载,隐藏,覆盖)

一. sizeof计算结构体 注&#xff1a;本机机器字长为64位 1.最普通的类和普通的继承 #include<iostream> using namespace std;class Parent{ public:void fun(){cout<<"Parent fun"<<endl;} }; class Child : public Parent{ public:void fun(){…

嵌入式面试题(一)

目录1 关键字volatile有什么含义&#xff1f;并给出三个不同的例子2. c和c中的struct有什么不同&#xff1f;3.进程和线程区别4.ARM流水线5.使用断言6 .嵌入式系统的定义7 局部变量能否和全局变量重名&#xff1f;8 如何引用一个已经定义过的全局变量&#xff1f;9、全局变量可…

能ping通ip但无法ping通域名和localhost //ping: bad address 'www.baidu.com'

错误描述&#xff1a; ~ # ping localhost ping: bad address localhost原因&#xff0c;在/etc目录下缺少hosts文件&#xff0c;将linux中的/etc hosts文件拷入即可 ~ # ping localhost PING localhost (127.0.0.1): 56 data bytes 64 bytes from 127.0.0.1: seq0 ttl64 tim…

eclipse导入web项目之后项目中出现小红叉解决办法

项目中有小红叉我遇到的最常见的情况&#xff1a; 1、项目代码本身有问题。&#xff08;这个就不说了&#xff0c;解决错误就OK&#xff09; 2、项目中的jar包丢失。&#xff08;有时候eclipse打开时会出现jar包丢失的情况&#xff0c;关闭eclipse重新打开或者重新引入jar包就O…

arm开发板通过网线连接笔记本电脑上外网

需要工具&#xff1a;arm开发板&#xff0c;网线&#xff0c;一台双网卡的win7笔记本电脑&#xff08;笔记本电脑一般都是双网卡&#xff09; 一、笔记本电脑需要先连上外网&#xff0c;可以连上家里的WIFI&#xff0c;或者手机开热点&#xff08;本人未测试过连接手机的热点&…

windows下实现Git在局域网使用

1.首先在主机A上创建一个文件夹用于存放你要公开的版本库。然后进入这个文件夹&#xff0c;右键->Git create repository here&#xff0c;弹出的窗口中勾选Make it Bare&#xff01;之后将这个文件夹完全共享&#xff08;共享都会吧&#xff1f;注意权限要让使用这个文件夹…

解决linux下QtCreator无法输入中文的情况

安装了QtCreator(Qt5.3.1自带版本)后无法输入中文&#xff0c;确切的说是无法打开输入法。以前使用iBus输入法的时候没有这个问题&#xff0c;现在使用sougou输入法才有的这个问题。 可以查看此文 http://www.cnblogs.com/oloroso/p/5114041.html 原因 有问题就得找原因&…

lintcode 滑动窗口的最大值(双端队列)

题目链接&#xff1a;http://www.lintcode.com/zh-cn/problem/sliding-window-maximum/# 滑动窗口的最大值 给出一个可能包含重复的整数数组&#xff0c;和一个大小为 k 的滑动窗口, 从左到右在数组中滑动这个窗口&#xff0c;找到数组中每个窗口内的最大值。 样例 给出数组 [1…

你的main函数规范吗?

在学习c语言的时候&#xff0c;有一个函数一直被我们使用&#xff0c;那就是main函数&#xff0c;但是你知道标准里面是怎么规定它的写法吗&#xff1f; 平时看见的main函数有下面这几种&#xff1a; 1.int main(void){ }2.int main(){ }3.int main(int argc, char *argv[])…

lintcode 最长上升连续子序列 II(二维最长上升连续序列)

题目链接&#xff1a;http://www.lintcode.com/zh-cn/problem/longest-increasing-continuous-subsequence-ii/ 最长上升连续子序列 II 给定一个整数矩阵&#xff08;其中&#xff0c;有 n 行&#xff0c; m 列&#xff09;&#xff0c;请找出矩阵中的最长上升连续子序列。&a…

适用于Linux的Windows子系统WSL

以前使用的都是在虚拟机里安装linux&#xff0c;最近才发现在win10提供了WSL(Windows Subsystem for Linux) &#xff0c;简单来说就是可以在win10里面直接使用Linux。 &#xff08;一&#xff09;首先打开Microsoft Store , 搜索 Linux &#xff08;二&#xff09;选择自己需…

jsp通过易宝方式实现在线支付

项目下载地址: https://github.com/hjzgg/OnlinePayment 参考&#xff1a;http://blog.csdn.net/jadyer/article/details/7380259?utm_sourcetuicool&utm_mediumreferral 效果图1&#xff1a;请求界面 效果图2&#xff1a;地支付请求和易宝之间建立连接之后跳转到相应的银…

permission denied是什么鬼?

问题&#xff1a;在PC端编译了一个arm芯片的测试程序&#xff0c;出现了permission denied 解决办法&#xff1a; 1.给文件赋予可执行权限 chmod ax xxx这是一般第一反应会想到的答案 2. 有时候已经有可执行权限&#xff0c;还是提示上面的错误此时要注意你的交叉编译器是否正…

CSS中div覆盖另一个div

将一个div覆盖在另一个div上有两种手段&#xff1a;一是设置margin为负值&#xff0c;二是设置绝对定位。 可以根个人情况设置z-index的值 1->position 为absolute的情况 <html> <head> <style> #div1{position:absolute;width:300px;height:300px;backgr…

nand flash和nor flash的这几点区别你知道吗?

这篇文章讲解nand flash和nor flash的特点和区别&#xff0c;不涉及存储原理的讲解 &#xff08;一&#xff09;Flash简介 FLASH是一种存储芯片&#xff0c;全名叫Flash EEPROM Memory&#xff0c;通地过程序可以修改数据&#xff0c;即平时所说的“闪存”。Flash又分为NAND f…

c++堆

c reference: http://www.cplusplus.com/reference/algorithm/make_heap/ heap并不属于STL容器组件&#xff0c;它分为 max heap 和min heap&#xff0c;在缺省情况下&#xff0c;max-heap是优先队列&#xff08;priority queue&#xff09;的底层实现机制。 而这个实现机制中的…