HTML에는 많은 일반적인 URL이 있습니다.
상대 URL :
example.php
데모/example.php
./example.php
../../example.php
/example.php
절대 URL :
http://dancewithnet.com/example.php
http://dancewithnet.com:80/example.php
https://dancewithnet.com/example.php
동시에 HTML에는 많은 요소 속성 값이 있습니다. 일반적으로 JavaScript를 사용하여 이러한 URL 속성 값을 얻는 두 가지 방법이 있습니다.
<a href = example.php id = example-a> 이시기에 페이지는 절대적으로 url http://dancewithnet.com/ </a>입니다.
<cript>
var oa = document.getElementById ( 'example-a');
oa.href == 'http://dancewithnet.com/example.php';
oa.getAttribute ( 'href') == 'example.php';
</스크립트>
속성에 직접 액세스하여 완전한 절대 URL을 얻고 GetAttribute 메소드를 통해 원래 속성 값을 얻기를 희망합니다. 실제로 이것은 비교적 이상적인 결과입니다. 모든 A 레벨 브라우저 중에서 Firefox와 IE8만이 결과를 성공적으로 얻을 수 있습니다. 다른 브라우저에는 다소 특별한 상황이 있습니다. 어떤 요소가 어떤 종류의 조건을 갖는 특정 속성에 대해서는 데모 예제를 참조하십시오.
대부분의 브라우저에서 문제는 두 메소드 모두 원래 속성 값을 반환하지만 실제 애플리케이션에서는 종종 필요한 것이 절대 URL이라는 것입니다. "자격이없는 HREF 값을 다루는"솔루션은 너무 복잡합니다. 다음은 비교적 간단한 솔루션입니다. 브라우저 코드의 차이를 고려하지 않으면 매우 간단합니다.
<양식 action = example.php id = example-form>
현재이 페이지는 절대적으로 URL http://dancewithnet.com/ </form>입니다
<cript>
var oform = document.getElementById ( 'example-form');
// IE6, IE7, SAFARI, Chrome, Opera
oform.action == 'example.php';
oa.getAttribute ( 'action') == 'example.php';
// 절대 URL을 얻는 일반적인 솔루션
getqualifyurl (oform, 'action') == 'http://dancewithnet.com/example.php';
getqualifyurl = function (oel, sattr) {
var surl = oel [sattr],
OD,
bdo = 거짓;
// IE8 이전 버전입니까?
//http://www.thespanner.co.uk/2009/01/29/detecting-browsers-javaScript-hacks/
//http://msdn.microsoft.com/en-us/library/7kx09ct1%28vs.80%29.aspx
/*@cc_on
노력하다{
bdo = @_jscript_version <5.8? true : @false;
} catch (e) {
bdo = 거짓;
}
@*/
// 사파리, 크롬 및 오페라 인 경우
if (/a /.__ proto __ == '//'|| /source/.test(/A/.ToString+ ''))))
|| /^function /( /. test ([]. sort)) {
bdo = true;
}
if (bdo) {
od = document.createElement ( 'div');
/*
// DOM 작업에서 얻은 결과는 변경되지 않습니다.
var oa = document.createElement ( 'a');
oa.href = oel [sattr];
OD.AppendChild (OA);
*/
od.innerhtml = [ '<a href =', surl, '> </a>'] .join ( '');
surl = od.firstchild.href;
}
반환 Surl;
}
</스크립트>
두 개의 선사 시대 브라우저 인 IE6과 IE7에는 더 흥미로운 것들이 있습니다. HTML 요소 A, 면적 및 IMG의 두 가지 메소드에 의해 얻은 속성 값은 절대 URL입니다. 다행히도 Microsoft는이 문제를 해결하기 위해 getAttribute의 두 번째 매개 변수를 제공하며 IFEAM 및 링크 요소에 대한 원래 속성을 반환하는 문제를 해결할 수도 있습니다.
<link href = ../../example.css id = example-link>
<a href = example.php id = example-a>이 시점에서 페이지는 절대적으로 url http://dancewithnet.com/ </a>입니다.
<cript>
var oa = document.getElementById ( 'example-a'),
olink = document.getElementById ( 'example-a');
oa.href == 'http://dancewithnet.com/example.php';
oa.getAttribute ( 'href') == 'http://dancewithnet.com/example.php';
oa.getAttribute ( 'href', 2) == 'example.php';
olink.href == 'example.php';
olink.getAttribute ( 'href') == 'example.php';
olink.getAttribute ( 'href', 4) == 'http://dancewithnet.com/example.php';
</스크립트>