js를 사용하여 HTML 페이지에서 이미지 주소를 빠르게 가져옵니다.

이번에는 js를 사용하여 html 페이지에서 이미지 주소를 빠르게 가져오는 방법을 보여드리겠습니다. js를 사용하여 html 페이지에서 이미지 주소를 빠르게 가져오는 주의사항은 무엇인가요? 사례를 살펴보겠습니다.

이 글에서는 HTML 코드로 이미지 주소를 얻기 위한 js의 구현 코드를 주로 소개합니다. 필요하신 분들은 참고하시면 됩니다.

첫 번째 방법: 정규식을 통해 js를 구현합니다

/** 
 * 获取html代码中图片地址 
 * @param htmlstr 
 * @returns {Array} 
 */ 
function getimgsrc(htmlstr) { 
  var reg = /<img.+?src=(&#39;|")?([^&#39;"]+)(&#39;|")?(?:\s+|>)/gim; 
  var arr = []; 
  while (tem = reg.exec(htmlstr)) { 
    arr.push(tem[2]); 
  } 
  return arr; 
}

두 번째 방법: jquery를 구현합니다.

 var img = $(this).find("img").attr("src");//这个是获得相对路径 prospertu
        //alert($(this).find("img").prop("src"));这个是获得完整路径 包括http://

js는 상대 경로를 사용하여 이미지의 src를 얻습니다.

js는 src를 얻을 때 도메인 이름 경로를 얻거나 동시에 이미지 경로가 mall/kmenus/001.png인 경우 obj를 사용합니다. src를 사용하거나 http://localhost/mall /kmenus/001.png를 얻습니다. 그러나 일반적으로 상대 경로를 얻는 것만으로도 충분합니다. 이 기록을 만드세요.

<img src="mall/kmenus/001.png" onclick="showSelected(this)">
function showSelected(obj)
{
 var rootpath='http://localhost/';
 res=obj.src.replace(rootpath,'');
 //分离路径和图片
 document.getElementById("cate_img_src").src=obj.src;
}

이 기사의 사례를 읽으신 후 방법을 마스터하셨다고 생각합니다. 더 흥미로운 정보를 보려면 PHP 중국어 웹사이트의 다른 관련 기사를 주목하세요!

추천 자료:

React BootStrap 프레임워크 사용 방법

쿠키 만료, 자동 업데이트 및 자동 획득 설정

웹팩 패키징 후 파일 압축을 더 작게 만드는 방법

위 내용은 js를 사용하여 HTML 페이지에서 이미지 주소를 빠르게 가져옵니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!