Apa yang dilakukan p dalam javascript?

Question

Mari kita lihat contoh HTML dan jangan lupa bahwa metode JavaScript peka huruf besar-kecil, jadi gunakan persis sama

Table of Contents Show

Contoh innerHTML
TextContent Contoh
Apakah yangTag dalam HTML digunakan untuk?
Meratakan teks dalam sebuah paragraf
Gaya paragraf dengan CSS
Masalah puisi dalam HTML
Masalah aksesibilitas
Dukungan Peramban
Apa peran tag P?
Apa arti P dalam kode?
Bagaimana cara membuat tag P di JavaScript?

Contoh innerHTML

Properti innerHTML menyetel atau mengembalikan konten HTML (HTML bagian dalam) dari suatu elemen

var text = document.getElementById("paragraphID").innerHTML;

Contoh Lengkap

<!DOCTYPE html>
<html>
<body>
    <p id="p1">Hello Text</p>
    <script>

       var text = document.getElementById("p1").innerHTML;

       alert(text);
   </script>

</body>
</html>

_

Keluaran

TextContent Contoh

Properti textContent menyetel atau mengembalikan konten teks dari node yang ditentukan, dan semua turunannya

var x =  document.getElementById("pTagId").textContent;

Kode lengkap

<!DOCTYPE html>
<html>
<body>
    <p id="p2">Another Text</p>
    <script>

        var x = document.getElementById("p2").textContent; 

       alert(text);
   </script>

</body>
</html>

Keluaran

Catatan. metode innerHTML mengembalikan HTML seperti namanya. Cukup sering, untuk mengambil atau menulis teks di dalam suatu elemen, orang menggunakan innerHTML. metode textContent harus digunakan sebagai gantinya. Karena teks tidak diuraikan sebagai HTML, kemungkinan besar kinerjanya lebih baik. Selain itu, ini menghindari vektor serangan XSS

Beri komentar jika Anda memiliki contoh keraguan atau saran lain tentang topik ini

Catatan. Semua kode Contoh JS diuji di browser Firefox dan browser Chrome
OS. Windows 10
Kode. Versi HTML5

Rohit

Gelar dalam Ilmu Komputer dan Insinyur. Pengembang Aplikasi dan memiliki banyak pengalaman bahasa Pemrograman. Antusias terhadap teknologi & suka belajar teknis

Sejajarkan atribut. Pada dasarnya, atribut align menentukan penyesuaian horizontal teks dalam sebuah paragraf. Namun, karena tidak lagi didukung di HTML 5, kita dapat menggunakan atribut serupa lainnya - yang dikenal sebagai properti perataan teks CSS untuk mendapatkan hasil yang serupa. Nilai atribut text-align dapat berkisar dari kiri, kanan, tengah, atau untuk membenarkan. Menentukan salah satu dari nilai di atas akan menghasilkan perataan teks pada arah tertentu

Apakah yangTag dalam HTML digunakan untuk?

Below are some points regarding the usage or how we can use p tag

dalam HTML

p tag
dalam HTML digunakan untuk memuat paragraf teks dalam dokumen
p tag
dalam HTML adalah elemen tingkat blok yang paling umum digunakan dan selalu dimulai pada baris baru. Meskipun demikian, elemen level blok lainnya tidak dapat dimuat di dalamnya
Jika elemen level blok lain digunakan sebelum tag p penutup
, maka paragraf ditutup secara otomatis
Browser menambahkan margin secara otomatis sebelum dan sesudah setiap paragraf
tag p dalam HTML adalah sebaris dan konten teks. Saya. e. , itu dibangun ke dalam halaman web alih-alih dimuat dari file eksternal
The start tag
dalam tag p diperlukan tetapi tag akhir
adalah opsional
p tag
dalam HTML dapat digunakan untuk pengelompokan struktural konten terkait, seperti gambar atau bidang formulir
Usually, the browser ignores the line break or space between the text inside the p tag
.
HTML Version: 2, 3.2, 4, 4.01, 5 supports p tag

Contoh

Setelah diskusi singkat tentang tag p, mari kita lihat beberapa contoh untuk memahami dengan jelas penggunaan tag p dalam HTML

Meratakan teks dalam sebuah paragraf

Kode



  
    Title of the document
    
    
  
  
    P Tag in HTML
    
        
      
        
      
The text alignment to the center is set with CSS property text-align

_

Keluaran

Explanation: In the above example, we have seen how we are using a p tag in our HTML document. Above, in the head section, there is a style sheet where we are calling the class attribute of the p tag in the body with the value of paragraph with .paragraph notation. Now the content inside the p tags

akan ditata sama sesuai dengan. definisi gaya paragraf di bagian kepala. Di dalam. paragraf di lembar gaya, kami menggunakan properti perataan teks CSS untuk menyelaraskan teks tag p di tengah halaman

Gaya paragraf dengan CSS

Kode








Style paragraphs with CSS

Hello everyone, this is a short paragraph

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Keluaran

Penjelasan. Pada contoh di atas, kita telah melihat bagaimana dengan bantuan CSS, kita dapat mengatur gaya paragraf kita di dalam tag p. Kali ini tanpa memiliki atribut class apapun, kita langsung memanggil tag p dengan nama tag mereka di dalam style sheet dari tag head. Kami telah melakukan beberapa gaya CSS untuk tag p kami, termasuk mengubah warnanya dari hitam menjadi merah, mengubah teks menjadi huruf besar, lekukan, perataan, dll. Kami juga telah menggunakan pemilih hover dimana ketika kursor mouse berada di atas konten paragraf, itu akan mengubah beberapa gaya seperti mengubah warna dari merah menjadi biru dan kemudian membuat kursor dari panah ke penunjuk

Masalah puisi dalam HTML

Kode




Poem problem in HTML

   Twinkle, twinkle, little star.
   How I wonder what you are.
   Up above the world so high.
   Like a diamond in the sky.


Note that the browser simply ignores the line breaks in the source code!

_

Keluaran

Penjelasan. Pada contoh di atas, kita telah melihat masalah puisi terkenal di HTML. Kami telah menulis puisi menggunakan tag p kami. Harap perhatikan bahwa kami telah menambahkan jeda baris, pemformatan yang tepat, dan spasi putih yang diperlukan dalam puisi kami. Tetapi saat menampilkan, browser kami mengabaikan semua jeda baris dan spasi putih yang dibuat dalam puisi, dan itu hanya ditampilkan seperti teks biasa lainnya di browser.

Jadi, dengan ini, kita dapat menyimpulkan bahwa browser mengabaikan jeda baris atau spasi di antara teks di dalam tag p

Masalah aksesibilitas

Seperti yang sudah kita ketahui, membagi setiap konten halaman ke dalam format paragraf yang relevan membuat halaman lebih mudah diakses (readable). Pintasan disediakan oleh pembaca layar untuk memungkinkan penggunanya melompat ke paragraf berikutnya atau sebelumnya, membiarkan mereka melewati konten apa pun

It will be problematic for people who navigate with screen-reading technology to navigate around the document, which has empty

elemen untuk menambah spasi antar paragraf. Karena pembaca Layar dapat mengumumkan keberadaan paragraf, tetapi tidak ada konten yang terkandung di dalamnya — karena memang tidak ada. Ini dapat membingungkan dan membuat frustrasi orang yang menggunakan pembaca layar

Jika diperlukan ruang ekstra, gunakan properti CSS seperti margin untuk membuat efek


p {
  margin-bottom: 2em; /* increase white space after a paragraph */
}

Dukungan Peramban
Almost all modern browsers support the p tag 
dalam HTML karena merupakan tag yang sangat banyak digunakan. Di bawah ini adalah daftar beberapa browser populer yang mendukung tag p
 
			Apa peran tag P?
			: The Paragraph element. The 
 HTML element mewakili sebuah paragraf . Paragraf biasanya direpresentasikan dalam media visual sebagai blok teks yang dipisahkan dari blok yang berdekatan dengan baris kosong dan/atau lekukan baris pertama, tetapi paragraf HTML dapat berupa pengelompokan struktural konten terkait, seperti gambar atau bidang formulir. 
		
			Apa arti P dalam kode?
			Dalam CSS, p adalah  pemilih tipe untuk elemen HTML, atau tipe simpul , 
		
			Bagaimana cara membuat tag P di JavaScript?
			Kode ini membuat elemen  . 
 const para = dokumen. createElement("p");
 node const = dokumen. createTextNode("Ini adalah paragraf baru. ");
 para. appendChild(simpul);
 elemen const = dokumen. getElementById("div1");
 elemen.  .  
 const elmnt = dokumen. getElementById("p1");
 elmnt. menghapus();
 induk induk = dokumen