HTML 웹페이지의 URL 표현_HTML/Xhtml_웹페이지 제작

example.php
demo/example.php
./example.php
../../example.php
/example.php

http://jb51.net/example.php
http://jb51.net:80/example.php
https://jb51.net/example.php

이번 페이지의 절대 URL은 http://jb51.net/
<script>var oA = document.getElementById('example -a'); <br>oA.href == 'http://jb51.net/example.php' ; <br>oA.getAttribute('href') == 'example.php'<br>&lt ;/script> <br><br> </div>속성에 직접 액세스하여 완전한 절대 URL을 얻으려고 합니다. 실제로 이것은 모든 A 중에서 비교적 이상적인 결과입니다. 수준의 브라우저에서는 Firefox와 IE8만이 이 결과를 성공적으로 얻을 수 있습니다. 다른 브라우저에는 다소 특별한 상황이 있습니다. 어떤 요소가 존재하는지에 대한 데모 예를 참조하세요. <br>대부분의 브라우저에서 문제는 두 방법 모두 원래 속성 값을 반환한다는 것입니다. 그러나 실제 응용 프로그램에서는 종종 절대 URL이 필요합니다. "정규화되지 않은 HREF 값 처리"의 해결 방법은 너무 복잡합니다. 브라우저 코드의 차이를 고려하지 않는다면 매우 간단한 솔루션입니다. <br><form action="example.php" id="example-form"> 페이지는 http://jb51.net/</form> <br><br><br><br><div class="msgheader"> <div class="right">코드를 복사하세요<span style="CURSOR: pointer" onclick="copycode(getid('phpcode42'));"><u></u>코드는 다음과 같습니다. 다음: </span> </div> </div><script> <div class="msgborder" id="phpcode42">var oForm = document.getElementById('example-form') <br>//IE6, IE7, Safari, Chrome, Opera <br>oForm .action == 'example.php'; <br>oA.getAttribute('action') == 'example.php'; <br>//절대 URL을 얻는 일반적인 솔루션<br>getQualifyURL(oForm,'action' ) == 'http://jb51.net/example.php'; <br>getQualifyURL = function(oEl,sAttr){ <br>var sUrl = oEl[sAttr], <br>oD, <br>bDo = false <br>//IE8 이전 버전인가요<br>//http://www.thespanner.co.uk/2009/01/29/Detecting-browsers-javascript-hacks/ <br>//http :/ /msdn.microsoft.com/en-us/library/7kx09ct1(VS.80).aspx <br>/*@cc_on <br>try{ <br>bDo = @_jscript_version < 5.8 ?true: @false ; <br />}catch(e){ <br />bDo = false <br />} <br />@*/ <br />//Safari, Chrome 및 Opera인 경우 <br />if(/a/.__proto__ ==' //' || /source/.test((/a/.toString '')) <br />|| /^function (/.test([].sort)){ <br />bDo = true ; <br />} <br />if(bDo){ <br />oD = document.createElement('div') <br />/* <br />//DOM 작업 결과는 변경되지 않습니다. <br />var oA = document.createElement('a'); <br />oA.href = oEl[sAttr] <br />oD.appendChild(oA) <br />*/ <br />oD.innerHTML = ['<a href="' ,sUrl,'"></a>'].join(''); <br>sUrl = oD.firstChild.href; <br>return sUrl; <br>&lt ;/script> <br><br><br>두 선사시대 브라우저 IE6과 IE7에 대해 좀 더 흥미로운 점이 있습니다. HTML 요소 A, AREA 및 IE7에서 두 가지 메소드로 얻은 속성 값입니다. IMG는 절대 URL입니다. 다행히 Microsoft는 이 문제를 해결하기 위해 getAttribute에 대한 두 번째 매개 변수를 제공합니다. 동시에 IFEAM 및 LINK 요소에 대한 원래 속성을 반환하는 위에서 언급한 두 가지 메서드의 문제도 해결할 수 있습니다. ><br><br> </div> <br><br>코드 복사<br><div class="msgheader"><div class="right">코드는 다음과 같습니다.<span style="CURSOR: pointer" onclick="copycode(getid('phpcode43'));"><div class="msgborder" id="phpcode43"> <br><link href="../../example.css" id="example-link"> <br><a href="example.php" id="example-a">此时页face绝对URL是http://jb51.net/</a> <br><스크립트> <br>var oA = document.getElementById('example-a'), <br>oLink = document.getElementById('example-a'); <br>oA.href == 'http://jb51.net/example.php'; <br>oA.getAttribute('href') == 'http://jb51.net/example.php'; <br>oA.getAttribute('href',2) == 'example.php'; <br>oLink.href == 'example.php'; <br>oLink.getAttribute('href') == 'example.php'; <br>oLink.getAttribute('href',4) == 'http://jb51.net/example.php'; <br></script>