ویژگی id HTML

تعریف و استفاده

id این属性 تعیین می‌کند که id یک عنصر HTML منحصر به فرد است. (این مقدار باید در مستند HTML منحصر به فرد باشد).

id این属性 معمولاً برای اشاره به استایل‌های جدول استایل‌ها و همچنین برای عمل کردن با عنصرهای دارای id خاص با استفاده از JavaScript (از طریق HTML DOM) استفاده می‌شود.

id این属性 می‌تواند به عنوان آنکر (anchor) لینک نیز استفاده شود.

لطفاً ببینید:

آموزش HTML:HTML id

آموزش HTML:ویژگی‌های HTML

آموزش CSS:اسلوب CSS

دستورالعمل CSS:CSS #id انتخاب‌گر

دستورالعمل HTML DOM:روش getElementById() HTML DOM

دستورالعمل HTML DOM:属性的 HTML DOM

دستورالعمل HTML DOM:اشیاء Style DOM HTML

مثال

مثال 1

از属性 id برای تغییر یک متن با استفاده از JavaScript استفاده می‌شود:

<html>
<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="displayResult()">تغییر متن</button>
<script>
function displayResult() {
  document.getElementById("myHeader").innerHTML = "Have a nice day!";
}
</script>
</body>
</html>

به طور مستقیم امتحان کنید

مثال‌های بیشتری در پایین صفحه ارائه شده است.

جملات

<عنصر id="id">

مقدار属性

مقدار توضیح
id

یک id منحصر به فرد برای عنصر تعیین کنید. قوانین نام‌گذاری:

  • باید حداقل یک کاراکتر داشته باشد
  • نمی‌تواند حاوی هیچ کاراکتر فضایی باشد

مثال‌های بیشتر

مثال 2

از属性 id برای لینک به عنصر دارای id مشخص استفاده می‌شود:

<html>
<body>
<h2><a id="top">عنوانی</a></h2>
<p>بسیار بسیار متن ....</p>
<p>بسیار بسیار متن ....</p>
<p>بسیار بسیار متن ....</p>
<a href="#top">بازگشت به بالا</a>
</body>
</html>

به طور مستقیم امتحان کنید

مثال 3

با استفاده از ویژگی id با اسلوب CSS متن را زیبا کنید:

<html>
<head>
<style>
#myHeader {
  color: red;
  text-align: center;
}
</style>
</head>
<body>
<h1 id="myHeader">CodeW3C.com بهترین است!</h1>
</body>
</html>

به طور مستقیم امتحان کنید

پشتیبانی از مرورگر

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
پشتیبانی پشتیبانی پشتیبانی پشتیبانی پشتیبانی