JS to determine the picture after loading complete the actual width of the picture method _javascript skills

This paper illustrates the method of obtaining the actual width and height of the picture after the loading of JS is finished. Share to everyone for your reference, specific as follows:

Usually, we use the JQ. Width ()/.height () method to get the width/height of the picture or to use the JS. Offsetwidth/.offsetheight method to get the width/height of the picture. But these methods are not the actual width of the picture when we set the width of the picture by the style, which is obviously not the result we want, is there a way to get the actual width? The answer is yes. The following code solves this problem:

JS Code:

Picture after loading complete get picture actual width high
var _test = document.getElementById ("test");
Test.onload = function () {
  imgsize.call (_test);
}
function Imgsize () {
  var imgobj = new Image ();
  IMGOBJ.SRC = THIS.SRC;
  Alert (imgobj.width + "\ n" + imgobj.height);
}

If you want to call this actual width in another method, you should alert (Imgobj.width + "\ n" + imgobj.height), change to return imgobj, and then the method that is invoked:

Window.onload = function () {
    function A () {
      var real= imgsize.call (_test);
      var realwidth = real.width;
      alert (realwidth);
    }
    A ();
}

The above method is too cumbersome, after my refinement, abbreviated as follows:

Window.onload = function () {
    var _test = document.getElementById ("test");//If JQ, convert this code directly to var _test = $ ("#test"); 。
    var imgobj = new Image ();
    IMGOBJ.SRC = _TEST.SRC; If JQ, then directly to replace this code IMGOBJ.SRC = _test.attr ("src"); Can.
    alert (imgobj.width);
}

In this way, the actual width of the picture can be called directly in other ways.

More readers interested in JavaScript-related content can view the site topics: "JavaScript Search Algorithm Skills Summary", "JavaScript animation effects and Skills summary", "JavaScript Error and debugging skills summary", " JavaScript data structure and algorithm skills summary, "javascript traversal algorithm and Skills summary" and "JavaScript Mathematical Computing Usage Summary"

I hope this article will help you with JavaScript programming.