Kaedah untuk menukar rentetan html ke objek jquery dom dalam kemahiran javascript_javascript

Rentetan html asal adalah seperti berikut:

var text="<div id='overLay' style='width:50px;height:60px;background:url(imgs/back.png) left top no-repeat; position: absolute;'>"
        + "<img style='margin-left:4px;margin-top: 3px;' src='ima.png' width='43px' height='43px'/>"
        + "</div>";

　1 Seterusnya, gunakan perpustakaan Jquery untuk menukar pembolehubah rentetan teks kepada objek Jquery.

Kod Jquery adalah seperti berikut:

　　alert($(text).html());

Di mana $(text) menukar rentetan teks menjadi objek Jquery, dan akhirnya menggunakan html() objek Jquery untuk mengeluarkan kandungan html dalam bentuk rentetan Hasilnya adalah seperti berikut:

<img style='margin-left:4px;margin-top: 3px;' src='ima.png' width='43px' height='43px'/>

Ia menunjukkan bahawa objek $(text)Jquery mewakili div elemen html paling luar.

　2. Tukar objek Jquery dan objek DOM antara satu sama lain.

Kodnya adalah seperti berikut:

var element= $(text).get(0) //element就是一个dom对象
　　var jqueryobj=$(element);//jqueryobj就是一个Jquery对象。

Nota: Perbezaan antara objek DOM dan objek Jquery

Pada pemahaman saya, objek Jquery dan objek DOM adalah elemen html yang dikapsulkan Anda boleh mengendalikan nod elemen html untuk memudahkan pengaturcaraan, tetapi beberapa kaedah di antara mereka tidak boleh dikongsi, seperti kaedah html() objek Jquery Objek DOM tidak boleh digunakan; dan GetElementById() objek DOM tidak boleh digunakan oleh objek Jquery. Oleh itu, penukaran bersama boleh dilakukan apabila perlu.

　3. Gunakan kod js untuk menukar pembolehubah rentetan teks kepada objek DOM.

Kod js adalah seperti berikut:

/*字符串转dom对象*/
function loadXMLString(txt) 
{
  try //Internet Explorer
   {
     xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
     xmlDoc.async="false";
     xmlDoc.loadXML(txt);
     //alert('IE');
     return(xmlDoc); 
   }
  catch(e)
   {
     try //Firefox, Mozilla, Opera, etc.
      {
        parser=new DOMParser();
        xmlDoc=parser.parseFromString(txt,"text/xml");
       //alert('FMO');
        return(xmlDoc);
      }
     catch(e) {alert(e.message)}
   }
  return(null);
}

Kod js yang menukar rentetan teks menjadi objek DOM adalah berkaitan dengan penyemak imbas, jadi. . . . . . Tulis secara berasingan.

Dengan cara ini, penukaran rentetan html kepada objek Jquery dan objek DOM direalisasikan.

Pengenalan kepada kaedah penukaran bersama antara objek jQuery dan objek dom

Apabila anda mula belajar jQuery, anda mungkin tidak dapat membezakan objek jQuery dan objek DOM. Bagi objek DOM, tidak banyak penjelasan yang kami temui. Mari fokus pada jQuery dan penukaran antara keduanya.

Apakah objek jQuery?

---Ia adalah objek yang dihasilkan dengan membalut objek DOM melalui jQuery. Objek jQuery adalah unik untuk jQuery dan boleh menggunakan kaedah dalam jQuery.

Contohnya:

$("#test").html() bermaksud: dapatkan kod html dalam elemen dengan ujian ID. Antaranya, html() ialah kaedah dalam jQuery

Kod ini bersamaan dengan menggunakan DOM untuk melaksanakan kod:

document.getElementById("id").innerHTML;
Walaupun objek jQuery dijana selepas membungkus objek DOM, jQuery tidak boleh menggunakan mana-mana kaedah objek DOM Begitu juga, objek DOM tidak boleh menggunakan kaedah dalam jQuery, ralat akan dilaporkan. Contohnya: $("#test").innerHTML, document.getElementById("id").html() dan kaedah penulisan lain adalah salah.

Perkara lain yang perlu diambil perhatian ialah objek jQuery yang diperoleh dengan menggunakan #id sebagai pemilih dan objek DOM yang diperolehi oleh document.getElementById("id") tidak setara. Sila lihat penukaran antara kedua-duanya di bawah.

Memandangkan jQuery berbeza tetapi juga berkaitan, objek jQuery dan objek DOM juga boleh ditukar antara satu sama lain. Sebelum menukar kedua-duanya, kita mula-mula membuat konvensyen: jika objek jQuery diperoleh, maka kita menambah $ di hadapan pembolehubah, seperti: var $variab = objek jQuery jika objek DOM diperoleh, ia adalah sama seperti biasa. : var variab = objek DOM; konvensyen ini hanya untuk kemudahan penjelasan dan perbezaan, dan tidak ditetapkan dalam penggunaan sebenar.

Tukar objek jQuery kepada objek DOM:

Dua kaedah penukaran menukar objek jQuery kepada objek DOM: [index] dan .get(index);

(1) Objek jQuery ialah objek data, dan objek DOM yang sepadan boleh diperolehi melalui kaedah [indeks].

Contohnya:

var $v =$("#v") ; //jQuery对象
var v=$v[0]; //DOM对象
alert(v.checked) //检测这个checkbox是否被选中

(2) jQuery sendiri menyediakan objek DOM yang sepadan melalui kaedah .get(index)

Contohnya:

var $v=$("#v"); //jQuery对象
var v=$v.get(0); //DOM对象
alert(v.checked) //检测这个checkbox是否被选中

Tukar objek DOM kepada objek jQuery:

Untuk objek DOM, anda hanya perlu membalut objek DOM dengan $() untuk mendapatkan objek jQuery. $(objek DOM)

Contohnya:

var v=document.getElementById("v"); //DOM对象
var $v=$(v); //jQuery对象

Selepas penukaran, anda boleh menggunakan mana-mana kaedah jQuery.

Melalui kaedah di atas, objek jQuery dan objek DOM boleh ditukar kepada satu sama lain secara sewenang-wenangnya. Apa yang perlu ditekankan sekali lagi ialah hanya objek DOM boleh menggunakan kaedah dalam DOM, dan objek jQuery tidak boleh menggunakan kaedah dalam DOM.