Comment obtenir directement l'adresse de l'image dans la page Web en utilisant js

Cette fois, je vais vous montrer comment obtenir directement l'adresse de la image dans la page web avec js Quelles sont les précautions pour obtenir directement l'adresse de l'image dans le page Web avec js. Ce qui suit est un cas pratique. Jetons un coup d'œil.

La première méthode : js est implémentée via des expressions régulières

/** 
 * 获取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; 
}

La deuxième méthode : jquery est implémentée

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

js Lors de l'obtention de l'image, le src est un chemin relatif

js obtient le chemin du nom de domaine lors de l'obtention du src ou en même temps si le chemin de l'image est mall/kmenus/001.png, utilisez obj.src ou obtenez http://localhost/mall/kmenus/001.png, mais généralement, seul le chemin relatif suffit. Faites ce disque.

<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;
}

Je pense que vous maîtrisez la méthode après avoir lu le cas dans cet article. Pour des informations plus intéressantes, veuillez prêter attention aux autres articles connexes sur le site Web chinois de php !

Lecture recommandée :

Comment utiliser CORS du framework Koa2 pour compléter des requêtes ajax inter-domaines

http dans Vue2.0 Affichage des requêtes et chargement

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!