절대 경로가있는 특정 SRC (상대 경로)로 이미지 업데이트

이 jQuery 코드 스 니펫은 지정된 도메인을 사용하여 상대 경로를 절대 경로로 변환하기 위해 이미지

속성을 ​​수정합니다. 이것은 크로스 도메인 테스트 또는 외부 도메인에서 이미지를 소싱 할 때 도움이됩니다. src

이 개선 된 버전은보다 강력한 정규 표현식 ()을 사용하여 상대 경로, 선행 슬래시가없는 경로를 올바르게 식별합니다. 또한 기본 URL을 추가하기 전에 상대 경로에서 누락 된 경우 선행 슬래시가 추가되도록합니다. 이것은 잘못된 경로 구성으로 잠재적 인 문제를 방지합니다 이 개선 된 코드를 보여주는 JSFiddle은 [JSFiddle Link- (실제 JSFIDDLE 링크로 바꾸면)에서 사용할 수 있습니다. (참고 : JSFiddle 링크를 동적으로 만들 수 없습니다) Ben Alman의 우수한 플러그인은 상대 및 절대 경로를 효과적으로 처리하는 것을 포함하여보다 포괄적 인 URL 조작 기능을 제공합니다. [GitHub Link- (실제 GitHub 링크로 바꾸기)]에서 찾을 수 있습니다.

상대 및 절대 경로에 대한 자주 묻는 질문 (FAQS)

<code class="language-javascript">(function ($) {
    $(document).ready(function () {
        $('img').each(function (i, v) {
            let $el = $(this),
                src = $el.attr('src'),
                //Improved regex to handle various relative path structures
                srcRx = /^\/?[^:]+/; // Matches leading slash (optional) followed by non-colon characters

            if (srcRx.test(src)) {
                let absoluteSrc = 'http://splash.abc.net.au' + (src.startsWith('/') ? src : '/' + src);
                $el.attr('src', absoluteSrc);
            }
        });
    });
})(jQuery);</code>

이 섹션은 웹 개발의 맥락에서 상대적 및 절대 경로에 대한 일반적인 질문에 답변합니다. srcRx 상대적 경로와 절대 경로의 차이는 무엇입니까?

절대 경로 : 웹 사이트 루트에서 파일 또는 리소스의 전체 위치를 지정합니다 (예 : ). 상대 경로 :

는 현재 파일의 위치와 관련하여 파일의 위치를 ​​지정합니다. 도메인을 생략하고 종종 jquery.ba-urlinternal.js (root retelative)로 시작하거나

를 사용하여 디렉토리 레벨을 올라갑니다 (예 : 또는 ).

. jQuery에서

속성의 값을 어떻게 얻습니까?

메소드를 사용하십시오 :

이것은 첫 번째 이미지의 를 가져옵니다. 모든 이미지를 반복하려면 를 사용하십시오

html의 상대 경로와 절대 경로의 차이는 무엇입니까?
• (위와 동일하지만 html의 맥락에서) 절대 경로 문제를 어떻게 해결합니까? https://www.example.com/images/logo.png 경로가 올바른지 확인하고 파일이 존재합니다. 현재 HTML 파일에 관한 절대 경로와 상대 경로의 위치에 대한 URL을 두 번 확인하십시오.
jQuery가있는 페이지에서 모든 이미지의
• 속성을 ​​어떻게 얻을 수 있습니까? (위의 jQuery 예제와 동일)를 배열에 저장하십시오.

위 내용은 절대 경로가있는 특정 SRC (상대 경로)로 이미지 업데이트의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!