HTML DOM 인용 속성

<시간/>

HTML 요소와 관련된 HTML DOM del cite 속성은 웹사이트의 일부 텍스트가 삭제된 이유를 사용자에게 알려주는 데 사용됩니다. 주어진 텍스트가 삭제된 이유를 나타내는 URL을 지정하면 됩니다.

del cite 속성은 시각적 신호가 없지만 화면 판독기에 도움이 될 수 있으므로 웹 사이트의 접근성을 높입니다. del cite 속성은 HTML ~~요소의 cite 속성 값을 설정하거나 반환합니다.~~

구문

다음은 −

의 구문입니다.

인용 속성 설정 -

delObject.cite = URL

여기서 URL은 텍스트가 삭제된 이유를 설명하는 문서의 URL을 지정합니다. URL은 상대 또는 절대일 수 있습니다.

예시

HTML DOM del cite 속성의 예를 살펴보겠습니다 -

<!DOCTYPE html>
<html>
<head>
<title>Del cite</title>
<style>
#Sample{color:blue};
</style>
</head>
<body>
<h2>del cite property example</h2>
<p><del id="Del1" cite="sampleDeleted.html">Some text has been deleted</del></p>
<p>Click the below button to change the cite attribute value of the above deleted text</p>
<button onclick="citeChange()">Change Cite</button>
<p id="Sample"></p>
<script>
   function citeChange() {
      document.getElementById("Del1").cite = "https://example.com/deletedText.html";
      document.getElementById("Sample").innerHTML = "The del cite attribute value was changed to 'https://example.com/deletedText.html'.";
   }
</script>
</body>
</html>

출력

이것은 다음과 같은 출력을 생성합니다 -

HTML DOM 인용 속성

인용 변경 버튼 클릭 시 -

HTML DOM 인용 속성

위의 예에서 -

먼저 ID가 "Del1"인

요소 내부에 ~~요소를 생성했으며 del 요소의 cite 속성 값이 "sampleDeleted.html"로 설정되었습니다.~~

<p><del id="Del1" cite="sampleDeleted.html">Some text has been deleted</del></p>

그런 다음 사용자가 클릭할 때 citeChange() 메서드를 실행하는 "인용 변경" 버튼을 만들었습니다.

<button onclick="citeChange()">Change Cite</button>

citeChange() 메서드는 getElementById() 메서드를 사용하여 요소를 가져오고 cite 속성 값을 "https://example.com/deletedText.html"로 변경합니다. 그런 다음 단락 요소의 innerHTML 속성을 사용하여 ID가 "Sample"인 단락에 이 변경 사항을 표시합니다. "Sample" 단락 내부의 텍스트는 ID에 해당하는 스타일이 적용되어 있기 때문에 파란색으로 표시됩니다. −

function citeChange() {
   document.getElementById("Del1").cite = "https://example.com/deletedText.html";
   document.getElementById("Sample").innerHTML = "The del cite attribute value was changed to 'https://example.com/deletedText.html'.";
}