From 23ad4d2736b06fcd07a102ea4719ecfe590c33f5 Mon Sep 17 00:00:00 2001 From: shubham oulkar <91728992+ShubhamOulkar@users.noreply.github.com> Date: Mon, 4 Mar 2024 18:49:55 +0530 Subject: [PATCH] new document for HTMLOListElement.{start, type, reversed} properties (#32312) initial document for HTMLOListElement.{start, type, reversed} properties --- .../api/htmlolistelement/reversed/index.md | 51 +++++++++++++++++ .../web/api/htmlolistelement/start/index.md | 53 ++++++++++++++++++ .../web/api/htmlolistelement/type/index.md | 56 +++++++++++++++++++ 3 files changed, 160 insertions(+) create mode 100644 files/en-us/web/api/htmlolistelement/reversed/index.md create mode 100644 files/en-us/web/api/htmlolistelement/start/index.md create mode 100644 files/en-us/web/api/htmlolistelement/type/index.md diff --git a/files/en-us/web/api/htmlolistelement/reversed/index.md b/files/en-us/web/api/htmlolistelement/reversed/index.md new file mode 100644 index 000000000000000..579b8d2c862c7f5 --- /dev/null +++ b/files/en-us/web/api/htmlolistelement/reversed/index.md @@ -0,0 +1,51 @@ +--- +title: "HTMLOListElement: reversed property" +short-title: reversed +slug: Web/API/HTMLOListElement/reversed +page-type: web-api-instance-property +browser-compat: api.HTMLOListElement.reversed +--- + +{{ApiRef("HTML DOM")}} + +The **`reversed`** property of the {{domxref("HTMLOListElement")}} interface indicates order of a list. + +It reflects the [`reversed`](/en-US/docs/Web/HTML/Element/ol#reversed) attribute of the {{HTMLElement("ol")}} element. + +## Value + +A `boolean` value. If `true`, it indicates that the list is a descending list (..., 3, 2, 1). + +## Examples + +### HTML + +```html +
    +
  1. Fee
  2. +
  3. Fi
  4. +
  5. Fo
  6. +
  7. Fum
  8. +
+``` + +### JavaScript + +```js +const olElement = document.querySelector("#order-list"); +console.log(olElement.reversed); // Output: "false" +olElement.reversed = "true"; +console.log(olElement.reversed); // Output: "true" +``` + +### Result + +{{EmbedLiveSample("Examples", 400, 100)}} + +## Specifications + +{{Specifications}} + +## Browser compatibility + +{{Compat}} diff --git a/files/en-us/web/api/htmlolistelement/start/index.md b/files/en-us/web/api/htmlolistelement/start/index.md new file mode 100644 index 000000000000000..76a95c0abbc729f --- /dev/null +++ b/files/en-us/web/api/htmlolistelement/start/index.md @@ -0,0 +1,53 @@ +--- +title: "HTMLOListElement: start property" +short-title: start +slug: Web/API/HTMLOListElement/start +page-type: web-api-instance-property +browser-compat: api.HTMLOListElement.start +--- + +{{ApiRef("HTML DOM")}} + +The **`start`** property of the {{domxref("HTMLOListElement")}} interface indicates starting value of the ordered list, with default value of 1. + +It reflects the [`start`](/en-US/docs/Web/HTML/Element/ol#start) attribute of the {{HTMLElement("ol")}} element. + +> **Note:** The `start` property value is independent of the {{domxref("HTMLOListElement.type")}} property; it is always numeric, even when type is letters or Roman numerals. + +## Value + +A `long` value. + +## Examples + +### HTML + +```html +
    +
  1. Fee
  2. +
  3. Fi
  4. +
  5. Fo
  6. +
  7. Fum
  8. +
+``` + +### JavaScript + +```js +const olElement = document.querySelector("#order-list"); +console.log(olElement.start); // Output: "1" +olElement.start = "11"; +console.log(olElement.start); // Output: "11" +``` + +### Result + +{{EmbedLiveSample("Examples", 400, 100)}} + +## Specifications + +{{Specifications}} + +## Browser compatibility + +{{Compat}} diff --git a/files/en-us/web/api/htmlolistelement/type/index.md b/files/en-us/web/api/htmlolistelement/type/index.md new file mode 100644 index 000000000000000..fb8b615adee1353 --- /dev/null +++ b/files/en-us/web/api/htmlolistelement/type/index.md @@ -0,0 +1,56 @@ +--- +title: "HTMLOListElement: type property" +short-title: type +slug: Web/API/HTMLOListElement/type +page-type: web-api-instance-property +browser-compat: api.HTMLOListElement.type +--- + +{{ApiRef("HTML DOM")}} + +The **`type`** property of the {{domxref("HTMLOListElement")}} interface indicates the kind of marker to be used to display ordered list. + +It reflects the [`type`](/en-US/docs/Web/HTML/Element/ol#type) attribute of the {{HTMLElement("ol")}} element. + +> **Note:** The `type` can be defined in CSS with the {{CSSxRef("list-style-type")}} property. The `list-style-type` property provides many more values. + +## Value + +A string representing the type. + +Its possible values are listed in the attribute [marker types](/en-US/docs/Web/HTML/Element/ol#type) section. + +## Examples + +### HTML + +```html +
    +
  1. Fee
  2. +
  3. Fi
  4. +
  5. Fo
  6. +
  7. Fum
  8. +
+``` + +### JavaScript + +```js +const olElement = document.querySelector("#order-list"); +// if type is not specified then return empty string +console.log(olElement.type); // Output: "" +olElement.type = "i"; // Using roman numeral type +console.log(olElement.type); // Output: "i" +``` + +### Result + +{{EmbedLiveSample("Examples", 400, 100)}} + +## Specifications + +{{Specifications}} + +## Browser compatibility + +{{Compat}}