Computer >> บทช่วยสอนคอมพิวเตอร์ >  >> การเขียนโปรแกรม >> HTML

คุณสมบัติ placeholder ของ Textarea ใน HTML DOM


คุณสมบัติ placeholder ของ Textarea ใน HTML DOM ใช้สำหรับอ่านหรือตั้งค่าของแอตทริบิวต์ placeholder ของเอลิเมนต์ textarea ในเอกสาร HTML

รูปแบบการใช้งาน (Syntax)

1. อ่านค่า placeholder

object.placeholder

2. ตั้งค่า placeholder

object.placeholder = "text"

ตัวอย่างการใช้งาน

<!DOCTYPE html>
<html>
<style>
  body {
    color: #000;
    background: lightseagreen;
    height: 100vh;
  }
  .btn {
    background: #db133a;
    border: none;
    height: 2rem;
    border-radius: 2px;
    width: 40%;
    display: block;
    color: #fff;
    outline: none;
    cursor: pointer;
  }
  .show {
    margin: 1rem 0;
    font-size: 1.5rem;
  }
</style>
<body>
<h1>ตัวอย่างคุณสมบัติ placeholder ของ Textarea</h1>
<textarea placeholder="Hi! I'm placeholder text of a textarea element" rows="8" cols='20'></textarea>
<button onclick="set()" class="btn">แสดง Placeholder</button>
<div class="show"></div>
<script>
  function set() {
    document.querySelector('.show').innerHTML = document.querySelector("textarea").placeholder;
  }
</script>
</body>
</html>

ผลลัพธ์

คลิกที่ปุ่ม "แสดง Placeholder" เพื่อแสดงค่าของแอตทริบิวต์ placeholder

คุณสมบัติ placeholder ของ Textarea ใน HTML DOM

คุณสมบัติ placeholder ของ Textarea ใน HTML DOM