Home >Web Front-end >JS Tutorial >How to convert JS objects to jQuery objects and back
How to convert JS objects to jQuery objects and back
- autoloadOriginal
- 2021-04-19 10:48:482294browse
jQuery is a fast and concise JavaScript framework that simplifies some operations of JS, but With the enhancement of JS native, JS also has some conveniences that jQuery cannot achieve. Some scenarios are still more suitable for JS, all Sometimes it is necessary to convert between JS objects and jQuery objects. This article will take you to take a look.
1. Convert jQuery object to JS native object
<body>
<ul class="list">
<li class="item">item1</li>
<li class="item">item2</li>
<li class="item">item3</li>
<li class="item">item4</li>
<li class="item">item5</li>
</ul>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.js"></script>
<script>
console.log($(".list .item"));
//任何一个$()返回的都是一个jQuery集合对象
//整体集合是一个jQuery对象，但是集合中每个成员都是原生js对象
//第一个li本身就是原生js对象
$('.list .item')[0].style.backgroundColor="yellow";
//使用jQuery封装的另一个方法
$('.list .item').get(2).style.backgroundColor="lightgreen";
</script>
</body>2. Convert JS object to jQuery object
<body>
<ul class="list">
<li class="item">item1</li>
<li class="item">item2</li>
<li class="item">item3</li>
<li class="item">item4</li>
<li class="item">item5</li>
</ul>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.js"></script>
<script>
console.log($(document.body) instanceof jQuery);//返回为true
</script>Recommended: "2021 js interview questions and answers (large summary)"
The above is the detailed content of How to convert JS objects to jQuery objects and back. For more information, please follow other related articles on the PHP Chinese website!