jQuery学习第二课

最新推荐文章于 2023-01-31 08:33:48 发布

栖息

最新推荐文章于 2023-01-31 08:33:48 发布

阅读量984

点赞数 1

分类专栏： html+js+jquery+xml+ajax 文章标签： jquery

本文链接：https://blog.csdn.net/Magneto7/article/details/22953263

版权

html+js+jquery+xml+ajax 专栏收录该内容

74 篇文章 0 订阅

订阅专栏

• 1.jquery对象和DOM对象

• 2.DOM对象和jquery对象的互相转换

• 3.jquery与其它js库如何共存

一.jquery对象和DOM对象

1.DOM对象

1.1. DOM，文档对象模型，每一份DOM都可以表示成一棵树

1.2. 从DOM树中可以看出各个元素之间的关系

1.3. 可以用getElementById或者getElementsByTagName等方法来获取元素节点，这样得到的DOM元素就是DOM对象。

DOM对象可以使用原生js中的方法，比如innerHtml等

//用DOM方法获得到的对象，就是DOM对象
alert(p.html());
//DOM对象不能使用任何jquery中的方法，只能使用DOM对象中的方法

2.jquery对象

2.1.jquery对象是由jquery包装过后的DOM对象，它可以使用jquery库里面的方法

2.2.jquery对象无法使用DOM对象中的方法

//用jquery选择器得到的对象，就是jquery对象

alert(p.toString());
//jquery对象不能使用DOM对象中的方法，只能使用jquery中的方法
//如果DOM对象中的方法在jquery库中被改写过，那么可以使用DOM对象中的方法

二.jquery对象转换成DOM对象

jquery对象转成成DOM对象有两种方法

1.使用index

2.使用get()方法

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>demo3</title>
<script src="jquery.js"></script>
</head>
<body>
<input type="text" id="a" value="111111">
<script>
  var input = $('#a');
  //alert(input[0].value);
  alert(input.get(0).value);

  //jquery对象转换成DOM对象的方法
  //1、可以使用索引，index
  //2、可以使用get(index)的方法
</script>
</body>
</html>

DOM对象转换成jquery对象

只要把DOM对象用$()包起来就OK了

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>demo4</title>
<script src="jquery.js"></script>
</head>
<body>
<input type="text" id="a" value="111111">

三.jquery与其它js库共存

使用jQuery.noConflict()方法释放$的权

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="prototype.js"></script>
<script src="jquery.js"></script>
</head>
<body>
<input type="text" id="a" value="aaaaa">
<script>
  //jQuery.noConflict();
  var sowhat = jQuery.noConflict()
  alert('这是jquery弹出的'+sowhat('#a').val());
  alert('这是prtotype弹出的'+$F('a'));
  //alert('这是jquery弹出的'+jQuery('#a').val());
</script>
</body>
</html>

栖息

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
jQuery学习第二课

• 1.jquery对象和DOM对象• 2.DOM对象和jquery对象的互相转换• 3.jquery与其它js库如何共存一.jquery对象和DOM对象1.DOM对象1.1. DOM，文档对象模型，每一份DOM都可以表示成一棵树1.2. 从DOM树中可以看出各个元素之间的关系1.3. 可以用getElementById或者getElement
复制链接

扫一扫