码迷,mamicode.com
首页 > Web开发 > 详细

Jquery load()方法 实现公用头部 尾部

时间:2015-08-12 21:43:02      阅读:351      评论:0      收藏:0      [点我收藏+]

标签:javascript   jquery   

//这是header.html里的代码,想作为头部引进来

<div id="loginBox">
    <span></span>
    <div>
        <div>
            <img src="common/images/login.jpg" alt="login"/>
        </div>
        <div>

        </div>
        <div>
            <label for="">
                <span>姓名:</span>
                <input id="username" type="text" placeholder="input your name"/>
            </label>
        </div>
        <div>
            <label for="">
                <span>密码:</span>
                <input id="password" type="password" placeholder="input your password"/>
            </label>
        </div>
        <div>
            <b>
                <button type="submit" id="loginsub" class="btn btn-success" >登陆</button>
                <button type="reset" id="loginset" class="btn btn-danger">重置</button>
            </b>
        </div>
    </div>
</div>



在header.js里边这样写

$("#header").load('common/html/header.html', function (data, status, xhr) {})

在在想要引用的文件中找到想引用的部分即可

<html lang="en">
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="../common/css/header.css"/>
    <link rel="stylesheet" href="../common/css/footer.css"/>
    <link rel="stylesheet" href="../tool/bootstrap/dist/css/bootstrap.css"/>
    <link rel="stylesheet" href="css/management.css"/>
    <title>Hisense</title>
</head>
<body>
<div id="header"></div>


版权声明:本文为博主原创文章,未经博主允许不得转载。

Jquery load()方法 实现公用头部 尾部

标签:javascript   jquery   

原文地址:http://blog.csdn.net/theowl/article/details/47451091

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!