HTML id egenskab

HTML id Ejerskab bruges til at specificere et unikt ID for HTML-elementet.

En HTML-dokument kan ikke indeholde flere elementer med det samme ID.

Brug af ejerskabsejerskab

id Ejerskab specificerer HTML-elementets unikke ID. id Værdien af ejerskab skal være unik i HTML-dokumentet.

id Ejerskab bruges til at pege på specifikke stildeklarationer i en stilark. JavaScript kan også bruge det til at tilgå og operere med elementer, der har et specifikt ID.

Id-s syntaks er: skriv en oktag (#), følgelig en id-navn. Derefter definerer du CSS-ejenskaber i curly parenteser {}.

i det følgende eksempel har vi en <h1> der peger på id-navnet "myHeader". Dette <h1> Elementer vil blive styret af elementet i head-sektionen #myHeader Stildefineringer bruges til at sætte stiler:

Example

<!DOCTYPE html>
<html>
<head>
<style>
#myHeader {
  background-color: lightblue;
  color: black;
  padding: 40px;
  text-align: center;
}
</style>
</head>
<body>
<h1 id="myHeader">My Header</h1>
</body>
</html>

Try it yourself

Bemærk:ID-navne er følsomme over for store og små bogstaver!

Bemærk:ID skal indeholde mindst én tegn og må ikke indeholde mellemrum (mellemrum, tabulatorer osv.).

Forskellen mellem klasse og ID

Samme klasse kan bruges af flere HTML-elementer, mens et id kan bruges af kun et HTML-element på siden:

Example

<style>
/* Definerer stilen for elementet med id "myHeader" */
#myHeader {
  background-color: lightblue;
  color: black;
  padding: 40px;
  text-align: center;
}
/* Definerer stilen for alle elementer med klassenavnet "city" */
.city {
  background-color: tomato;
  color: white;
  padding: 10px;
}
</style>
<!-- Elementer med unikke id'er -->
<h1 id="myHeader">My Cities</h1>
<!-- Elementer med samme klasse navn kan være flere -->
<h2 class="city">London</h2>
<p>London er hovedstaden i England.</p>
<h2 class="city">Paris</h2>
<p>Paris er hovedstaden i Frankrig.</p>
<h2 class="city">Tokyo</h2>
<p>Tokyo er hovedstaden i Japan.</p>

Try it yourself

Tip:Vær venlig at besøge vores CSS Tutorial lær mere om CSS

HTML-bogmærker gennemføres ved hjælp af ID og links

HTML-bogmærker bruges til at lade læseren hoppe til bestemte dele af en webside.

Hvis siden er meget lang, kan bogmærker være meget nyttige.

For at bruge bogmærker skal du først oprette dem og derefter tilføje links til dem.

Herefter, når du klikker på et link, ruller siden til den position, der har en bogmærke.

Example

First, use}} id Attribute to create bookmarks:

<h2 id="C4">Kapitel 4</h2>

Then, on the same page, add a link to this bookmark ("Gå til kapitel 4”):

Example

<a href="#C4">Gå til kapitel 4</a>

Try it yourself

Or, on another page, add a link to this bookmark ("Gå til kapitel 4”):

<a href="html_demo.html#C4">Gå til kapitel 4</a>

Use the id attribute in JavaScript

JavaScript can also use the id attribute to perform certain tasks for specific elements.

JavaScript can be used getElementById() Method to access elements with a specific id:

Example

Use the id attribute to handle text through JavaScript:

<script>
function displayResult() {
  document.getElementById("myHeader").innerHTML = "Have a nice day!";
}
</script>

Try it yourself

Tip:Please HTML JavaScript In this chapter, or our JavaScript Tutorial Learn JavaScript here.

Chapter Summary

  • id Attribute to specify a unique id for HTML elements
  • id The value of the attribute must be unique in the HTML document
  • CSS and JavaScript can be used id Attribute to select elements or set styles for specific elements
  • id The value of the attribute is case-sensitive
  • id The attribute can also be used to create HTML bookmarks
  • JavaScript can be used getElementById() Method to access elements with a specific id