jQuery/Javascript를 사용하여 폴더의 이미지를 웹 페이지로 로드하는 방법은 무엇입니까?

jQuery/Javascript를 사용하여 폴더의 이미지를 웹 페이지로 로드

"images"라는 폴더의 이미지를 HTML 페이지로 로드하려면 , JavaScript 또는 jQuery를 사용할 수 있습니다. 이미지 이름이 순번이 아니더라도 해결 방법은 있습니다.

해결 방법:

<code class="js">var folder = "images/";

$.ajax({
    url : folder,
    success: function (data) {
        $(data).find("a").attr("href", function (i, val) {
            if( val.match(/\.(jpe?g|png|gif)$/) ) { 
                $("body").append( "<img src='"+ folder + val +"'>" );
            } 
        });
    }
});</code>

설명:

• 1행: .js 파일을 기준으로 폴더 경로를 정의합니다.
• 3-8행: jQuery의 $.ajax() 함수를 사용하여 폴더 내용을 로드합니다. 성공하면 $(data)를 사용하여 HTML 응답을 구문 분석합니다.
• 6-7행: 일반 문자열을 사용하여 이미지 파일 확장자와 일치하는 href가 있는 앵커 태그()를 찾습니다. 표현식.
• 8행: 일치하는 각 이미지 파일에 대한 태그를 페이지에 추가합니다.

고려 사항:

• Apache 서버: "옵션 인덱스" 활성화 또는 Express.js용 "serve-index"와 같은 패키지를 사용하여 디렉터리 목록을 허용합니다.
• Node.js 서버: 폴더 목록을 활성화하려면 다음 코드를 사용하세요.

<code class="js">app.use('/images', serveIndex(path.join(__dirname, '/images')));</code>

이 접근 방식을 사용하면 이름에 관계없이 "이미지" 폴더의 모든 이미지를 웹 페이지로 쉽게 로드할 수 있습니다.

위 내용은 jQuery/Javascript를 사용하여 폴더의 이미지를 웹 페이지로 로드하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!