una obtener img imagen con change javascript image src

obtener - set src img javascript



Javascript: obtener<img> src y establecer como variable? (6)

¿Qué tal esto, por ejemplo:

var youtubeimgsrc = document.getElementById("youtubeimg").getAttribute(''src'');

Si el img abajo está presente

<img id="youtubeimg" src="http://i1.ytimg.com/vi/VK4ah66jBvE/0.jpg"/>

y el guion es

<script> var youtubeimgsrc = "something here" document.write(''''+youtubeimgsrc+'''') </script>

y el resultado debe ser http://i1.ytimg.com/vi/VK4ah66jBvE/0.jpg

¿Qué puedo hacer para obtener la fuente de la imagen y establecerla como variable?

Mientras el guión esté después del img , entonces:

var youtubeimgsrc = document.getElementById("youtubeimg").src;

Ver getElementById en la especificación DOM.

Si la secuencia de comandos está antes de la img , por supuesto, la img todavía no existe, y eso no funciona. Esta es una de las razones por las que muchas personas recomiendan poner guiones al final del elemento del body .

Nota al margen: no importa en tu caso porque has usado una URL absoluta, pero si usaste una URL relativa en el atributo, así:

<img id="foo" src="/images/example.png">

... la propiedad reflejada src será la URL resuelta , es decir, la URL absoluta que se convierte en. Entonces, si eso estuviera en la página http://www.example.com , document.getElementById("foo").src le daría "http://www.example.com/images/example.png" .

Si quisiera el contenido del atributo src tal como está , sin resolverlo, usaría getAttribute en getAttribute lugar: document.getElementById("foo").getAttribute("src") . Eso te daría "/images/example.png" con mi ejemplo anterior.

Si tiene una URL absoluta, como la de su pregunta, no importa.

Si no tiene una identificación en la imagen pero tiene un div padre, esta es también una técnica que puede usar.

<div id="myDiv"><img src="http://www.example.com/image.png"></div> var myVar = document.querySelectorAll(''#myDiv img'')[0].src

Usa JQuery, es fácil.

Incluya la biblioteca JQuery en su archivo html en la cabeza como tal:

<head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> </head>

(Asegúrese de que esta etiqueta de secuencia de comandos vaya antes que sus otras etiquetas de secuencia de comandos en su archivo html)

Apunte su identificación en su archivo JavaScript como tal:

<script> var youtubeimcsrc = $(''#youtubeimg'').attr(''src''); //your var will be the src string that you''re looking for </script>

en esta situación, agarraría el elemento por su id usando getElementById y luego solo usaría .src

var youtubeimgsrc = document.getElementById("youtubeimg").src;