A文档载入B文档的内容，并且通过JQ操作被引入到A文档中的元素

A文档 （index.html）：

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title></title>

     <link href="css/bootstrap.css" rel="stylesheet">

</head>

<body>

<div id="textDiv">

</div>

<script src="js/jquery-2.1.4.min.js"></script>

<script src="js/bootstrap.js"></script>

<script>

    $('#textDiv').load('modal.html',function(){

        $('#modalBox').modal('show');

    });

</script>

</body>

</html>

B文档（modal.html）：

<div class="modal fade" id="modalBox" role="dialog" aria-labelledby="conTitle">

    <div class="modal-dialog" role="document" >

        <div class="modal-content">

            <div class="modal-header" style="background-color: #fff;border-top-left-radius: 15px;border-top-right-radius: 15px;">

                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>

                <h4 class="modal-title" id="conTitle">Modal title</h4>

            </div>

            <div class="modal-body" style="background-color:forestgreen;">

                <p>One fine body…</p>

            </div>

            <div class="modal-footer" style="border-bottom-left-radius: 15px;border-bottom-right-radius: 15px;">

                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>

                <button type="button" class="btn btn-primary">Save changes</button>

            </div>

        </div>

    </div>

</div>

1、index.html引入jQuery文件,由于我有用到bootstrap，因此我引入了boostrap.css和bootstrap.js文件，要注意这些文件在文档中的位置和顺序；js文件一般放到最后在引入，由于bootstrap.js依赖jquery.文件，因此jquery.js要再比bootstrap.js先引入；

2、jq代码：

 $('#textDiv').load('modal.html',function(){

        $('#modalBox').modal('show');

    });

--1、 使用load的方法将modal.html加载到index.html中id为textDiv的div中；

--2、在使用函数对modal.html中的元素操作（弹幕）；

jQuery使用load方法加载其他文档内容的更多相关文章

  1. 在ASP.NET MVC中使用jQuery的Load方法加载静态页面的一个注意点

    使用使用jQuery的Load方法可以加载静态页面,本篇就在ASP.NET MVC下实现. Model先行: public class Article { public int Id { get; s ...

  2. 打开地图文件和shape文件代码加载Mxd文档

    代码加载Mxd文档 用代码添加Mxd文档,用到AxMapControl.LoadMxFile(sFilePath),我们只要将Mxd文档的路径传给这个方法即可 /// <summary>  ...

  3. jquery中的load方法加载页面无法缓存问题

    在A页面中调用JQuery中的load方法,加载另一个B页面,B页面中的样式文件和JS文件无法从浏览器缓存中获取,每次都是实时获取.这是因为B页面的HTML经load方法处理后,会为每个样式和JS文件 ...

  4. Jquery的Ready方法加载为什么两次？

    Ready方法会调用两次? 查看对应的页面是否存在<iframe src="#" --> 存在iframe加载这个页面的时候,页面就会加载两次. $(document) ...

  5. jQuery的$.getScript方法去加载javaScript文档解析

    1.两个文件的代码如下: <script> function Ajax(){ //将9-4.html中的Ajax()函数进行修改 $.getScript('9-8.js',function ...

  6. C# 加载xml文档文件及加载xml字符串

    //创建XmlDocument对象 XmlDocument xmlDoc = new XmlDocument(); //载入xml文件名 xmlDoc.Load(filename); //如果是xml ...

  7. iframe加载的文档高度

    var clientHeight = $("#iframe").contents().find("body").height();

  8. pyqt5加载pdf文档失败

    import sys from PyQt5.QtWidgets import QApplication, QMainWindow, QFileDialog from PyPDF2 import Pdf ...

  9. 使用jquery的load方法设计动态加载，并解决浏览器前进、后退、刷新等问题

    继上一篇 使用jquery的load方法设计动态加载,并解决被加载页面JavaScript失效问题 解决了后台业务系统的部分动态加载问题,然而该框架离正常的用户体验还存在一些问题,如:浏览器的前进.后 ...

随机推荐

  1. Asp.net图片文件上传

    对课本上的代码进行了一点的优化 1.获取文件的名称和文件的后缀名 引用了System.IO, 用Path.GetFileNamehe()取得文件名和Path.GetExtension获取文件的后缀 2 ...

  2. sm30表维护做排序

    好吧,之前有人问过,因为代码太少就一直没发...今天给出来吧 众所周知,表维护其实就是个TC,只是表维护是统一的,没有使用通用名内表名什么的,这个就不多说了,来重点: TC的一般排序可以放在:1,PB ...

  3. 读<jquery 权威指南>[7]-性能优化与最佳实践

    一.优化选择器执行速度 1. 优先使用ID选择器和标记选择器 使用选择器时应该首选ID选择器($("#id")),其次是标记选择器($("div")),最后再选 ...

  4. Props属性

    大多数组件在创建时就可以使用各种参数来进行定制.用于定制的这些参数就称为props(属性). import React, { Component } from 'react'; import { Ap ...

  5. what is archeage honor weapons?

    in my opinion,there are many kinds of weapons in archeage online, those include basic weapons and ma ...

  6. TreeSet和Comparator 对TreeSet排序

    使用TreeSet和Comparator,编写TreeSetTestInner类,要求对TreeSet中的元素"HashSet"."ArrayList".&qu ...

  7. vs2013 遇到的web性能记录器无法使用问题

    诊断和修复Web测试记录栏的问题.自2005年以来VSTS运也出现了各种由客户多年来提出不同的问题.记录Web测试时,这在一定程度经常提到的一个话题是一个残疾或不存在的Web测试记录吧.因为它可以令人 ...

  8. PHP fastcgi模式大文件上传500错误

    最近在项目中中上传图片时,大约有300多K,结果报了个服务器错误,以前从未遇到过,错误的内容如下: mod_fcgid: www.111cn.net HTTP request length 13229 ...

  9. Winform基础知识

    1.关于登陆部分 this.DialogResult = DialogResult.OK; this.Close(); FrmLogin login = new FrmLogin(m_CurUser) ...

  10. Gym 100818G （模拟退火）

    题目大意 给一张n个点的无向图,要求给每个点染色0或1,使得每个点的相邻相同颜色点的数量小于等于其度数的一半. 解题分析 没想到什么好的算法,就随机乱搞了. 若某个状态时,一个点的度数为cnt,相邻相 ...