วิธีนับคำทั้งหมดบนเว็บเพจด้วย Vanilla JavaScript

เรียนรู้วิธีนับคำทั้งหมดในส่วนใดส่วนหนึ่งของเว็บไซต์ด้วย Vanilla JavaScript

บางครั้งการนับคำทั้งหมดในโพสต์หรือหน้าก็มีประโยชน์ คุณกำลังสร้าง ตัวนับคำ คุณลักษณะสำหรับเว็บไซต์ของคุณ? คุณสามารถใช้ข้อมูลโค้ด JavaScript ต่อไปนี้เพื่อทำสิ่งนั้นได้อย่างรวดเร็ว

var wordsInPost = wordCount(document.querySelectorAll(".posts-content"))

function wordCount(words) {
  var count = 0
  for (var i = 0; i < words.length; i++) {
    count += words[i].textContent.split(" ").length
  }
  return count
}

console.log(wordsInPost)

คัดลอกและวางโค้ด JS ลงในคอนโซลเบราว์เซอร์ของคุณเพื่อทดสอบบนเว็บไซต์ใดๆ เพียงให้แน่ใจว่าคุณกำหนดเป้าหมายตัวเลือกที่ถูกต้อง

วิธีนับคำทั้งหมดบนเว็บเพจด้วย Vanilla JavaScript

ฟังก์ชัน JavaScript ทำหน้าที่อะไร

นับคำทั้งหมดภายในองค์ประกอบเป้าหมายของคุณ ในตัวอย่างข้างต้น เรากำหนดเป้าหมายเป็น .post-content ตัวเลือกคลาส
จำนวนคำประกอบด้วยองค์ประกอบข้อความทั้งหมด (หัวเรื่อง ย่อหน้า รายการ บล็อกโควต ฯลฯ) ทุกอย่างที่เกี่ยวข้อง
ยกเว้นช่องว่าง เครื่องหมายจุลภาค ฯลฯ

วิธีใช้ฟังก์ชัน JavaScript

แทนที่ .post-content class ด้วยตัวเลือกคลาส id หรือองค์ประกอบที่คุณมีสำหรับโพสต์หรือเพจของคุณ

หมายเหตุ:คุณสามารถใช้ getElementsByClassName() แทน querySelectorAll() .

คุณสามารถทดสอบโค้ดได้ในคอนโซลของเบราว์เซอร์ที่คุณชื่นชอบหรือบน CodePen นี้