如何在我的html文件中使用外部jquery显示和图像

时间:2012-07-12 07:21:37

标签: javascript jquery

我是jquery的新手,任何人都可以告诉我如何在我的html文件中使用外部jquery显示和图像。

我希望我的html干净并加载外部jquery文件中提到图像路径的图像。

我的jquery文件就像这个testjquery.js

 // url to load the image (which i dont know ,whats the code for it)

并在我的html文件中。

<html>
  <head>
    <script type="text/javascript">
        (function() {
            var test = document.createElement('script');
            test.type = 'text/javascript'; 
            test.async = true;
            test.src = 'testquery.js';
            var s = document.getElementsByTagName('script')[0];
            s.parentNode.insertBefore(test, s);

            test.onload=function(){
                // function to load the external image
            }
         })();
    </script>
  </head>
  <body>
  </body>
</html>

提前致谢!

4 个答案:

答案 0 :(得分:0)

我不确切地知道你的意思......但我猜你的意思是突兀的jQuery。所以你的HTML保持干净。您可以将javascript放在外部文件或页面底部。如果将其放在外部文件中,则可以删除脚本标记。

<html>
  <head>
    <script src="style.js" type="text/javascript"></script>
  </head>
  <body>
    <div id="image"></div>
  </body>
</html>

并在style.js中(您可以将它放在同一目录中)

  $(document).ready(function(){
    imagePath = 'your_image.png';
    $('#image').html("<img src='" + imagePath + "' />")
  });

您可以使用html或追加。 html函数清除整个图像div并将其替换为图像。附加,将其附加到div,以便稍后再添加另一个。 (document).ready函数将在加载整个文档后运行。

答案 1 :(得分:0)

我认为你的问题是错误的 所以测试一下

首先确定Loaded Jquery脚本文件

并为div元素设置html

<div id="imageContainer"></div>

<script>
    $('#imageContainer').html('<img src="/images/test.jpg" />');
</script>

答案 2 :(得分:0)

您可以简单地使用:

<强> HTML

<div id="divWhereYouWantAddImage"></div>

<强> JQUERY

$('#divWhereYouWantAddImage').append("<img src='img.jpg' />");

您可以阅读有关jquery .append()函数here的更多信息。

答案 3 :(得分:0)

以下是ExternalJSFile.js中的文件内容

imageUrl = 'your/img/path.png';

你的html文件

<html>  
</html>

<script src="ExternalJSFile.js" type="text/javascript"></script>

<script type="text/javascript">
 $(document).ready(function(){
     alert(imageUrl);
  });
</script>