如何实现js对象和jquery对象的相互转换

JavaScript042

如何实现js对象和jquery对象的相互转换,第1张

jQuery对象不能使用DOM中的方法，但是如果对jQuery对象所提供的方法不熟悉，或者jQuery没有封装想要的方法，不得不实用DOM对象的时候，有以下两种处理方法。jQuery提供了两种方法将一个jQuery对象转换成DOm对象，即[index]和get(index).

(1)jQuery对象是一个数组对象，可以通过[index]的方法得到相应的DOM对象。

jQuery代码如下：

复制代码代码如下:

var $cr = $("#cr")//jQuery对象

var cr = $cr[0] //DOM对象

alert(cr.checked) //检测这个checkbox是否选中了

(2)另一种方法是jQuery本身提供的，通过get(index)方法得到相应的DOM对象。

jQuery代码如下：

复制代码代码如下:

[js]var $cr = $("#cr")

var cr = $cr.get(0)

alert(cr.checked)

<!doctype html>

<html lang="en">

<head>

<meta charset="UTF-8">

<title>demo</title>

<script src="jquery.js"></script>

<script>

jQuery(function(){

var x=['PHP','JAVA','C','C++','JS','Ruby']

var y=[]

jQuery.each(x,function(idx,lang){

jQuery('#c'+ idx).click(function(){

var s = y.join(',').indexOf(lang)

s >= 0 ? jQuery.each(y,function(idx){

this == lang &&y.splice(idx,1)

}) : y.push(lang)

jQuery('#i').val(y.join(' '))

})

})

})

</script>

</head>

<body>

<div class="tab">

<div class="c" id="c0">PHP</div>

<div class="c" id="c1">JAVA</div>

<div class="c" id="c2">C</div>

<div class="c" id="c3">C++</div>

<div class="c" id="c4">JS</div>

<div class="c" id="c5">Ruby</div>

<input id="i" type="text" style="width:720pxheight:25pxborder:1px solid #ccc"/>

</div>

</body>

</html>