Question

这里的javascript非常新的人，所以请原谅新手问题。

我想用javascript加载一个非常简单的小图像。我能做一个由onload触发的吗？

注意：原因是我有一个网站的部分需要javascript才能正常工作。我想要一个小绿圈来向用户显示他们已经安装了javascript。

Answer 1

非常简单（无需导入库）：

<!-- somewhere in your document's <body> tag -->
<div id="divId">

</div>

<!-- in your document's <head> tag, or a separate .js file -->
<script>
// addLoadEvent function for executing JavaScript on page load
// adds the event in such a way that any previously added onload functions 
// will be executed first.
function addLoadEvent(func) {
  var oldonload = window.onload;
  if (typeof window.onload != 'function') {
    window.onload = func;
  } else {
    window.onload = function() {
      if (oldonload) {
        oldonload();
      }
      func();
    }
  }
}

addLoadEvent(function() {
  document.getElementById('divId').innerHTML = "<img src='yourimage.gif' />"
  // add more code here if necessary
});



</script>

Answer 2

此代码假定您不使用JQuery。

var preloadedImage;    

function PageIsLoaded(e)
{
    preloadedImage = new Image();
    img.src = 'pathToYourImage.jpg';
    // preloading
    img.onLoad = function () { displayImage() };
}

function displayImage()
{  
    // Assuming that this id refers to an IMG tag
    var imgHolder = document.getElementById('imgHolder');
    imgHolder = preloadedImage;
}

Answer 3

最简单，最简单的方法是使用javascript库，它使用load或ready函数。文档准备就绪时，启动jquery的示例：）

$(function () {
    $('body').append('<img src="/img/js-is-working.jpg" />');
});

非常简单的javascript图像加载问题

3 个答案: