Rumah  >  Artikel  >  hujung hadapan web  >  Adakah innerhtml kaedah jquery?

Adakah innerhtml kaedah jquery?

青灯夜游
青灯夜游asal
2021-11-12 18:25:312302semak imbas

innerhtml bukan kaedah jquery, tetapi atribut DOM HTML, iaitu atribut JavaScript ini digunakan untuk menetapkan atau mengembalikan kandungan elemen (termasuk sub-elemen), sintaksnya ialah " elemen object.innerHTML="content value"" atau "ElementObject.innerHTML".

Adakah innerhtml kaedah jquery?

Persekitaran pengendalian tutorial ini: sistem Windows 7, versi JavaScript 1.8.5, komputer Dell G3.

innerhtml bukan kaedah jquery, tetapi atribut DOM HTML yang digunakan untuk menetapkan atau mengembalikan kandungan elemen. Atribut

innerHTML menetapkan atau mengembalikan HTML antara teg pembukaan dan penutup elemen label.

Sintaks:

//设置元素内容
Object.innerHTML=text

//返回元素内容
Object.innerHTML

Yang berikut menggunakan contoh untuk memperkenalkan penggunaan atribut innerHTML.

Apabila input tidak kosong, teks yang dimasukkan oleh pengguna akan disambungkan ke label di hadapan kotak teks dan dipaparkan dalam div baris demi baris selepas setiap penghantaran, dan kandungan kotak teks akan dibersihkan pada masa yang sama. Jika input kosong, kotak dialog amaran muncul untuk menggesa pengguna.

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>使用innerHTML属性设詈div元素内容</title>
<style>
    div {width:240px; height:200px; background:#f1f1f1; border:1px solid #333; padding:10px;}
</style>
<script>
    window.onload = function(){
        var oDiv = document.getElementById(&#39;div1&#39;);
        var oSpan = document.getElementByldCspan1&#39;);
        var oText = document.getElementById(&#39;text1&#39;);
        var oBtn = document.getElementById(&#39;btn1.&#39;);
        oBtn.onclick = function(){
        if(!oText.value.match(/s*/)){ //使用正则表达式判断输入的是否为空字符
            //将文本框前的 label、输入的文本、换行标签以及div原来的内容一起作为div元素的内容            
            oDiv.innerHTML += oSpan.innerHTML + oText.value + &#39;<br>&#39;;
            oText.value = &#39;&#39;;   //发送信息后清空文本框
        }else{
            alert("请输入信息!&#39;);
        }
    };
};
</script>
</head>
<body>
    <div id="div1"> </div>
    <span id="span1">妙味:</span>
    <input id="text1" type="text"/>
    <input id="btn1" type="button" value="发送"/>
</body>
</html>

Pernyataan penghakiman if() dalam kod di atas menggunakan ungkapan biasa untuk menilai sama ada kandungan input ialah aksara nol. Kod ini menggunakan oSpan.innerHTML dan oDiv.innerHTML masing-masing untuk mendapatkan kandungan elemen span dan div, dan kemudian menggunakan oDiv.innerHTML untuk menggunakan kandungan elemen span dan elemen div, kandungan yang dimasukkan dalam kotak teks dan tag pemisah baris bersama-sama sebagai kandungan div untuk ditetapkan.

Nota: oDiv.innerHTML =oSpan.innerHTML oText.value bersamaan dengan oDiv.innerHTML=oDiv.innerHTML oSpan.innerHTML oText.value.

Gambar di bawah menunjukkan hasil daripada memasukkan dua baris teks dalam kotak teks dan mengklik butang hantar:

Adakah innerhtml kaedah jquery?

Untuk lebih banyak pengetahuan berkaitan pengaturcaraan, sila Lawati: Pengenalan kepada Pengaturcaraan! !

Atas ialah kandungan terperinci Adakah innerhtml kaedah jquery?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn