1

Me surgió la necesidad de obtener algunos valores desde el atributo data

Tengo lo siguiente:

<img data-bind="attr: {src: app.utils.getFavicon('http://gamovideo.com/9tbtyuoti8ae')}" src="http://www.google.com/s2/favicons?domain=gamovideo.com">

Pero solo necesito obtener la parte del enlace

http://gamovideo.com/9tbtyuoti8ae

No tengo idea de como podría ser, si necesitan mas información de lo que se quiere realizar, favor indicarme en los comentarios.

Gracias de antemano y Saludos.

2 respuestas 2

1

Puedes hacerlo mediante una expresión regular:

const img = document.querySelector('img');
const bind = img.getAttribute('data-bind');
const regex = /(http|ftp|https):\/\/([\w_-]+(?:(?:\.[\w_-]+)+))([\w.,@?^=%&:/~+#-]*[\w@?^=%&/~+#-])?/;

if (regex.test(bind)) {
  const url = regex.exec(bind)[0];
  console.info(url);
}
<img data-bind="attr: {src: app.utils.getFavicon('http://gamovideo.com/9tbtyuoti8ae')}" src="http://www.google.com/s2/favicons?domain=gamovideo.com"/>

2
  • buenas gracias por tu respuesta acertada, en caso que quiera extraer mas de un link osea <img data-bind="attr: {src: app.utils.getFavicon('gamovideo.com/9tbtyuoti8ae')}" src="google.com/s2/favicons?domain=gamovideo.com"> se repite varias veces claro con distinto link
    – andrio
    Commented el 12 abr. 2017 a las 20:54
  • Tienes que aplicar el mismo procedimiento para cada atributo (data-bind, src, etc.).
    – gugadev
    Commented el 12 abr. 2017 a las 20:59
1

Si las expresiones regulares te asustan, aquí tienes un ejemplo de como hacerlo mas sencillo pero igualmente funcional ;))

$(function (){
 url = $("img").data("bind").split("'")[1];
 console.log(url);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<img data-bind="attr: {src: app.utils.getFavicon('http://gamovideo.com/9tbtyuoti8ae')}" src="http://www.google.com/s2/favicons?domain=gamovideo.com"/>

En el ejemplo uso jQuery porque es fácil de usar, multiplataformas y te permite desarrollar mas escribiendo menos.

Ahora te explico: el Método split divide un cadena de caracteres en una matriz utilizando para ello un carácter (o cadena) como separador, en el caso que nos planteas seria:

Cadena a convertir:

attr: {src: app.utils.getFavicon('http://gamovideo.com/9tbtyuoti8ae')}" src="http:
//www.google.com/s2/favicons?domain=gamovideo.com

Cadena (o Carácter) usado como separado (o delimitador): '

Matriz creada en el proceso de división:

0:attr: {src: app.utils.getFavicon(
1:http://gamovideo.com/9tbtyuoti8ae
2:)}" src="http://www.google.com/s2/favicons?domain=gamovideo.com

Es por ello que cuando ejecutamos: $("img").data("bind").split("'")[1], nos devuelve el indice 1 de la matriz que es en este caso el url: 1:http://gamovideo.com/9tbtyuoti8ae .

Espero esto te sirva, Saludos!! ;))

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.