JQuery:用外部文件中的html替换DIV内容.完整的例子?

gMa*_*ale 10 javascript jquery jquery-selectors

什么是在页面上启用jQuery然后使用它来用外部文件中的HTML文本替换DIV内容的完整代码?

背景

我是jQuery的新手,我很乐意使用它,所以我可以学习它.我有一个网站,我需要替换每个页面上存在的相同div(页脚)的内容.幸运的是,每个页面都已导入相同的头文件.所以我要用一些jQuery魔法来修改那个头文件!我无法找到完整的例子,我认为其他人可能有类似的问题.谁比SO大师更好问?

给定一个基本的HTML文件Example.html:

<html>
    <head>
    </head>
    <body>
        <div id="selectedTarget">
            Existing content.
        </div>
    </body>
</html>
Run Code Online (Sandbox Code Playgroud)

还有一个includes/contentSnippet.html包含html片段的外部文件:

<p>
    Hello World!
</p>
Run Code Online (Sandbox Code Playgroud)

Example.html文件将链接正确的jQuery库(来自./js目录)并通过jQuery替换div的内容是什么?

Lee*_*Lee 16

好的,我会咬......

<html>
    <head>
        <script type="text/javascript" src="http://code.jquery.com/jquery-1.5.1.min.js"></script>
        <script type="text/javascript">
           $(document).ready(function(){
               $('#selectedTarget').load('includes/contentSnippet.html');
           });
        </script>   
    </head>
    <body>
        <div id="selectedTarget">
            Existing content.
        </div>
    </body>
</html>
Run Code Online (Sandbox Code Playgroud)

笔记:

  1. 我直接从jQuery的公共CDN(允许和鼓励)链接jquery库
  2. 你可以在这里找到jQuery load()函数的文档.