javascript_기본지식을 활용하여 상대경로를 절대경로로 변환하는 예

여기서 소개하는 방법은 본질적으로 DOM을 생성하거나 JavaScript를 통해 계산하는 두 가지 방법입니다.

1) 새로 생성된 이미지를 통해 테스트 후 Aborted 요청이 전송되며 IE6에서는 이를 지원하지 않습니다. 새 이미지를 document.createElement('IMG')로 변경하면 테스트가 마음에 들지 않을 수 있습니다. 이 솔루션

코드 복사 코드는 다음과 같습니다.

function getAbsoluteUrl(url){
var img = new Image();
img.src = url; //상대 경로를 Image로 설정하면 요청이 전송됩니다.
url = img.src; //상대 경로가 절대 경로가 되었습니다. path
img.src = null; // 요청 취소
return url;
}
getAbsoluteUrl("showroom/list");

2) Create Anchor(링크) 이 메소드는 요청을 발행하지 않지만(DOM에 참여할 때 요청이 생성됨) IE6도 이를 지원하지 않습니다

코드 복사 코드는 다음과 같습니다.

/*jslint regexp: true, white: true, maxerr : 50, 들여쓰기: 2 */

function parseURI(url) {
var m = String(url).replace(/^s |s $/g, '').match (/^ ([^:/?#] :)?(//(?:[^:@]*(?::[^:@]*)?@)?(([^:/?#] *)( ?::(d*))?))?([^?#]*)(?[^#]*)?(#[sS]*)?/);
// 권위 = '// ' user ':' pass '@' 호스트 이름 ':' port
return (m ? {
href : m[0] || '',
프로토콜 : m[1] || '',
권한: m[2] || '',
호스트: m[3] || '',
호스트 이름: m[4] || m[5 ] || '',
경로 이름 : m[6] || '',
검색 : m[7] || '',
해시 : m[8] ||
} : null);
}

function absolutizeURI(base, href) {// RFC 3986

function RemoveDotSegments(input) {
var 출력 = [] ;
input.replace(/^(..?(/|$)) /, '')
.replace(//(.(/|$)) /g, '/')
.replace (//..$/, '/../')
.replace(//?[^/]*/g, function (p) {
if (p === ' /.. ') {
           output.pop(); replacement(/^//, input.charAt(0) === '/' ? '/' : '');
}

href =parsURI(href || '');
base =parsURI(base || '');

return !href || !base null : (href.protocol || base.protocol)
(href.protocol || href.authority ? href.authority : base.authority)
RemoveDotSegments(href.protocol || href.authority || href.pathname.charAt(0) == = '/' ? href.pathname : (href.pathname ? ( (base.authority && !base.pathname ? '/' : '') base.pathname.slice(0, base.pathname.lastIndexOf('/') 1) href.pathname) : base.pathname))
(href.protocol || href.authority || href.pathname ? href.search : (href.search || base.search))
                href. hash;
}



저희 제품은 모바일 웹페이지이기 때문에 더 이상 IE6을 지원하지 않아 결국 두 번째 솔루션을 사용하게 되었습니다.

원래 메소드를 사용하여 모든 이미지와 앵커에 접근하면 절대 경로가 반환되는 것을 볼 수 있습니다. 원래 상대 경로를 반환하려면 jQuery.attr() 메소드와 같은 DOM 쿼리 메소드를 사용할 수 있습니다. :

코드 복사

코드는 다음과 같습니다. //절대 경로를 반환합니다. jQuery 객체는 본질적으로 "배열과 유사한" 구조(인수와 유사)이므로 [0]을 사용하여 원본 객체에 액세스한 다음 "href"를 사용할 수 있습니다.console.log($anchor[0 ]["href"]);//원래 경로로 돌아가기console.log($anchor.attr("href"));