Front-end basis -jQuery objects and DOM objects

Chapter 3 jQuery objects and DOM objects

The difference between 3.1 jQuery objects and DOM objects

DOM objects

用原生JavaScript获取的DOM对象
	通过document.getElementById()  反馈的是元素(DOM对象)
通过document.getElementsByTagName()获取到的是什么?
	伪数组(集合),集合中的每一个对象是DOM对象

jQuery object

jQuery对象 用$()的方式获取的对象
jQuery对象又可以叫做包装集(包装的DOM对象的集合)

the difference

jQuery object can not use DOM object members, DOM objects can not use members of the jQuery object

<div id="box"></div>
<script>
    // DOM对象
    var box = document.getElementById('box');
    // 错误
    box.text('hello');
    // 正确
    box.innerText = 'hello';

    // jQuery对象,jQuery对象加前缀$,用以区分DOM对象
    var $box = $('#box');
    // 错误
    $box.innerText = 'hello';
    // 正确
    $box.text('hello');
</script>

3.2 jQuery conversion objects and DOM object

jQuery对象转换成DOM对象:   
	jQuery对象.get(索引值); 
	jQuery对象[索引值] 
    	jQuery对象是包装集(集合),从集合中取数据可以使用索引的方式
DOM对象转换成jQuery对象:   
	$(DOM对象) 只有这一种方法;
Released 1800 original articles · won praise 1922 · Views 170,000 +

Guess you like

Origin blog.csdn.net/weixin_42528266/article/details/105115162