jQuery对象和DOM对象的转换实例详解

最新推荐文章于 2024-09-14 15:26:51 发布
最新推荐文章于 2024-09-14 15:26:51 发布
阅读量683 收藏
点赞数
文章标签： jquery stylesheet string html function import
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/hanxiaoshuang123/article/details/7308116
版权
 

jQuery对象和DOM对象的转换实例详解

 

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>

<%

String path = request.getContextPath();

String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";

%>

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

    <head>

       <base href="<%=basePath%>">

 

       <title>My JSP 'example01.jsp' starting page</title>

 

       <meta http-equiv="pragma" content="no-cache">

       <meta http-equiv="cache-control" content="no-cache">

       <meta http-equiv="expires" content="0">

       <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">

       <meta http-equiv="description" content="This is my page">

       <!--

    <link rel="stylesheet" type="text/css" href="styles.css">

    -->

       <script type="text/javascript"

           src="${pageContext.request.contextPath}/js/jquery-1.7.1.js">

</script>

 

    </head>

 

    <body>

       用户名：<input type="text" id="name"/>

    </body>

</html>

<script type="text/javascript">

 

//dom对象和jQquery对象的转换

 

//窗体加载完毕之后触发的事件

$(document).ready(function() {

 

    //根据id获取dom对象

    var domInput = document.getElementById("name");

    domInput.value="laowang";

   

    //根据id获取jQuery对象   如果获取的是jQuery对象，最好在前面加上$  是一个约定

    var $jInput = $("#name");

    //修改文本框的值 ，在jQuery中用val

    $jInput.val("hello");

   

   

    //dom对象转换成jQuery对象

    var $dInput = $(domInput);

    $dInput.val("nini");

   

    //把jQuery转换成dom对象   jQuery本身是一个数组对象，可以通过 index[0]来获取dom

    var dInput = $jInput[0];

    dInput.value="nilaiil";

   

    //第二种把jQuery转换为dom的方法

    var dInput = $jInput.get(0);

    dInput.value="老";

});

</script>

 

hanxiaoshuang321123
关注
jQuery——jquery的引用、 jQuery对象与dom对象转换、选择器、方法
ranran0306的博客
05-16 423
jQuery——jquery的引用、 jQuery对象与dom对象转换、选择器、方法
JQuery（二） -- JS对象和JQuery对象转换
PUYALEI的博客
05-09 209
jQuery 本质上虽然也是 JS，但如果想使用 jQuery 的属性和方法那么必须保证对象是 jQuery 对象，而不是 JS 方式获得的 DOM 对象，二者的 API 方法不能混合使用，若想使用对方的 API，需要进行对象的转换。
JQuery dom对象与jquery对象相互转换 小案例
LPDFIGHT的博客
07-25 357
案例： html> head> meta charset="UTF-8"> title>dom对象与jquery对象相互转换title> script src="../js/jquery-3.1.1.min.js" type="text/javascript" charset="utf-8">script> script type="text/javascript">
JQuery对象与DOM对象间的转换
zLanaDelRey的博客
01-07 174
JQuery对象转换成DOM对象 JQuery对象是一个特殊的数组对象，即使只有一个元素，JQuery对象仍然是一个数组。之所以说其特殊，是因为实际上JQuery对象是包含一个数组对象和各种方法的类。而jQuery对象数组里保存的是DOM对象，因此可以通过索引的方式将jQuery对象转换成DOM队形。 var $cr = $("#Name"); //获取jQuery对象$cr var cr...
jQuery-DOM对象和jQuery对象及转换 学习笔记二
lansky07
11-26 1925
刚开始学习jQuery，可能一时会分不清楚哪些是jQuery对象，哪些是DOM对象。至于DOM对象不多解释，我们接触的太多了，下面重点介绍一下jQuery，以及两者相互间的转换。什么是jQuery对象？---就是通过jQuery包装DOM对象后产生的对象。jQuery对象是jQuery独有的，其可以使用jQuery里的方法。比如：$("#test").html()   意思是指：获
jquery对象和DOM对象的相互转换详解
10-21
在Web开发中，经常需要在jQuery对象和原生DOM对象之间进行转换。jQuery对象是jQuery库提供的，对DOM元素的封装，而DOM对象则是原生的JavaScript对象。这两种对象各有特点，jQuery对象支持jQuery提供的方法，而DOM...
jQuery对象与DOM对象转换方法详解
01-21
本文实例分析了jQuery对象与DOM对象的转换方法。分享给大家供大家参考，具体如下： jQuery对象转换为dom对象 只有jQuery对象才能调用jQuery类库的各种函数，同样有些dom对象的属性和方法在jQuery上也是无法调用的，...
JQuery中DOM事件绑定用法详解
10-24
如果需要在事件处理函数中使用jQuery方法，可以使用`$(this)`将DOM元素转换为jQuery对象。为了提高代码的可读性和效率，经常重复使用的jQuery选择器可以赋值给一个局部变量。例如： ```javascript $("#buttonId")....
jQuery数组处理详解(含实例演示)
12-12
`$.each()`适合遍历数组和对象，`$.grep()`用于过滤数组，`$.map()`可以进行数组转换，而`$.inArray()`则用于检查数组中是否存在特定值。掌握这些方法，将极大地提升你在jQuery中处理数组的效率。
jQuery post数据至ashx实例详解
10-21
### jQuery Post数据至ASHX实例详解 #### 1. jQuery中的POST方法 在jQuery中，可以使用`$.ajax`方法来实现异步的HTTP请求。在实例中，我们通过`$.ajax`方法将数据POST到ASHX处理程序。这里我们关注`$.ajax`方法中...
前端用html写excel文件直接打开
全易
09-10 588
html文件直接用excel打开
富文本中去掉 HTML 和 CSS 样式，只保留纯文本
S筱潇S四维Smile
09-11 356
要从富文本中去掉 HTML 和 CSS 样式，只保留纯文本，可以使用以下几种方法：1. 纯 JavaScript 方法你可以使用 JavaScript 的innerText或来提取文本，而忽略 HTML 标签和样式。
《HTML 与 CSS—— 响应式设计》
asd4353012的博客
09-11 1511
HTML 和 CSS 在响应式设计中起着至关重要的作用。通过使用语义化标签、响应式图像、媒体查询、弹性布局和响应式网格系统等技术，可以实现网页在不同设备上的自适应显示，提供最佳的用户体验。在进行响应式设计时，要遵循移动优先设计、内容优先和测试优化等最佳实践，不断提高网页的质量和性能。随着移动设备的普及和技术的不断发展，响应式设计将变得越来越重要，开发者需要不断学习和掌握新的技术和方法，以满足用户的需求。
打造民国风格炫酷个人网页：用HTML和CSS3传递民国风韵
最新发布
m0_61118741的博客
09-14 1054
这个示例展示了如何结合民国风格和现代网页设计元素，创造一个既古典又炫酷的网页。通过细致的CSS样式和动画效果，我们实现了古典美学与现代技术的完美融合。这种设计不仅在视觉上吸引人，也在功能上提供了良好的用户体验。希望这个示例对你在网页设计方面有所启发！
水平居中的几种方法（总结）
致未来的你。的博客
09-11 728
水平居中的几种方法（总结）
前端：HTML、CSS、JS、Vue
云扬的博客
09-04 4755
本文主要介绍了HTML、CSS、JavaScript、Vue的基本语法和使用。供个人学习使用
Requests-HTML模块怎样安装和使用？
2301_79698214的博客
09-11 537
上述代码中，首先创建了一个HTMLSession对象，然后使用get()方法发送GET请求，获取网页的HTML内容。最后，使用response.html.text属性获取HTML文本，并将其打印输出。以上就是使用Requests-HTML模块的基本步骤。在Python脚本中导入Requests-HTML模块。使用Requests-HTML模块发送HTTP请求和解析HTML内容。使用pip命令安装Requests-HTML模块。系统会自动下载并安装Requests-HTML模块及其依赖项。
jQuery功能详解：元素引用与对象转换
要将DOM对象转换为jQuery对象，可以使用`$()`包裹。例如，`$(document.getElementById("msg"))`将返回一个jQuery对象。相反，若要从jQuery对象获取DOM对象，可以使用索引，如`$("#msg")[0]`，或使用`eq()`或`get()`...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值