jquery的load加载js页面到指定div中

简介:
4<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>My JSP 'test.jsp' starting page</title>
    
    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="cache-control" content="no-cache">
    <meta http-equiv="expires" content="0">    
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="This is my page">
    <!--
    <link rel="stylesheet" type="text/css" href="styles.css">
    -->
    <script src="js/jquery-2.1.1.min.js">
        
    </script>
    <style>
        #div,#div2{
            background-color:#bef3f3;
            width:400px;
            height:300px;
            margin:10px;
            position:relative;
            overflow:hidden;
        }
        #div3,#div4{
            background-color:#bff7f0;
            width:150px;
            height:100px;
            margin:10px;
            position:relative;
            display:inline;
        }
        #div3{
            float:left;
            overflow:hidden;
        }
        #div4{
            float:right;
        }
    </style>
  </head>
  
  <body>
   
    <div id="div">
        <input type="button" value="jquery加载js文件" id="button"><br>
        <input type="button" value="jquery加载下拉框" id="button1"><br>
    </div>
    <div id="div2">
        <div id="div3">
            div3
        </div>
        <div id="div4">
            div4
        </div>
    </div>
  </body>
  <script language="JavaScript">
      $("#button").click(function(){
        $("#div3").load("test2/test3.jsp");
    });
    $("#button1").click(function(){
        $("#div4").load("test2/test2.jsp");
    });
  </script>
</html>

wKioL1gQbtKRVHRjAAA_jWxpCG8765.png-wh_50


本文转自 matengbing 51CTO博客,原文链接:http://blog.51cto.com/matengbing/1865963


相关文章
|
2月前
|
Web App开发 数据采集 JavaScript
动态网页爬取:Python如何获取JS加载的数据?
动态网页爬取:Python如何获取JS加载的数据?
433 58
|
4月前
|
JSON JavaScript 数据格式
jqtimeline.js-简单又好用的jquery时间轴插件
jqtimeline.js-简单又好用的jquery时间轴插件
|
8月前
|
JavaScript 前端开发
js+jquery实现贪吃蛇经典小游戏
本项目采用HTML、CSS、JavaScript和jQuery技术,无需游戏框架支持。通过下载项目文件至本地,双击index.html即可启动贪吃蛇游戏。游戏界面简洁,支持方向键控制蛇移动,空格键实现游戏暂停与恢复功能。
168 14
|
8月前
|
JavaScript 前端开发 容器
jQuery多功能滑块插件r-slider.js
r-slider.js是一款jQuery多功能滑块插件。使用该插件,可以制作出滑块、开关按钮、进度条、向导步骤等多种效果。
113 5
|
8月前
|
JavaScript
jQuery+css3制作精美的2024圣诞节倒计时页面
jQuery+css3制作精美的2024圣诞节倒计时页面动画
71 0
jQuery+css3制作精美的2024圣诞节倒计时页面
|
8月前
|
缓存 前端开发 JavaScript
JavaScript加载优化
JavaScript加载优化
|
8月前
|
缓存 前端开发 JavaScript
优化CSS和JavaScript加载
优化CSS和JavaScript加载
127 1
|
8月前
|
缓存 前端开发 JavaScript
优化CSS和JavaScript加载
Next.js和Nuxt.js在优化CSS和JavaScript加载方面提供了多种策略和工具。Next.js通过代码拆分、图片优化和特定的CSS/JavaScript优化措施提升性能;Nuxt.js则通过代码分割、懒加载、预渲染静态页面、Webpack配置和服务端缓存来实现优化。两者均能有效提高应用性能。
|
8月前
|
Web App开发 JavaScript iOS开发
基于jquery开源的页面内模拟滚动条特效插件scrollbar
abcrollBar是一个基于jquery运行的开源滚动条特效插件,体积小巧使用简单的滚动条小插件,它可以通过鼠标中轴滑动页面内的模拟滚动条,或鼠标拖动滚动条查看滚动框架里的内容。支持自定义滚动条的样式,滚动条可选择横或竖呈现,默认也可选择显示或隐藏滚动条。
77 0
|
Web App开发 JavaScript 前端开发
高性能JavaScript之加载和执行
JS在浏览器中的性能,可以认为是开发者所面临的最重要的可行性问题。这个问题因JS的阻塞特性变得复杂,也就是说当浏览器在执行JS代码时,不能同时做其他任何事情。事实上,大多数浏览器都使用单一进程来处理UI(用户界面)更新和JavaScript脚本执行,所以同一时刻只能做其中一件事情。
1225 0

热门文章

最新文章