Computer >> 컴퓨터 >  >> 프로그램 작성 >> HTML

HTML DOM 앵커 검색 속성

<시간/>

앵커 태그()와 연결된 HTML DOM 검색 속성은 href 속성 값의 쿼리 문자열 부분을 반환합니다. 쿼리 문자열 부분은 ? url에 있으며 일반적으로 서버에 정보를 전달하는 데 사용됩니다. get 요청이 서버로 전송되고 정보가 링크에 일반 텍스트로 포함될 때 사용됩니다.

구문

다음은

의 구문입니다.
  • ) 검색 속성 반환

anchorObject.search
  • b) 검색 속성 설정

anchorObject.search = querystring

예시

HTML DOM 앵커 검색 속성의 예를 살펴보겠습니다 -

<!DOCTYPE html>
<html>
<body>
<p><a id="myAnchor" target="_blank"
href="https://www.examplesite.com/ex.htm?id=Username">Example Site</a></p>
<p>Click the button to change the querystring part of the above website</p>
<p>Inspect the url before clicking the button to inspect the changes</p>
<button onclick="demo()">Change Search</button>
<script>
   function demo() {
      document.getElementById("myAnchor").search = "program=Sample";
   }
</script>
</body>
</html>

출력

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

'양식 ID 표시' 확인란을 선택하기 전에 -

HTML DOM 앵커 검색 속성

"검색 변경" 버튼을 클릭하지 않으면 링크는 다음과 같습니다 -

www.examplesite.com/ex.htm?id=Username

"검색 변경" 버튼을 클릭하면 링크는 -

가 됩니다.
www.examplesite.com/ex.htm?prog=Sample

위의 예에서 -

검색 속성 값을 설정하거나 반환하기 위해 검색 속성 값을 조작하기 위해 검색 속성이 있는 앵커 태그를 가져왔습니다.

<p><a id="myAnchor" target="_blank"
href="https://www.examplesite.com/ex.htm?id=Username">Example Site</a></p>

그런 다음 myFunction() −

을 실행하기 위해 "검색 변경"이라는 버튼을 만들었습니다.
<button onclick="demo()">Change Search</button>

myFunction()은 검색 문자열 부분을 id=”Username”에서 program=Sample

로 변경합니다.
function demo() {
   document.getElementById("myAnchor").search = "program=Sample";
}