• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • dedecms
  • ecshop
  • z-blog
  • UcHome
  • UCenter
  • drupal
  • WordPress
  • 帝国cms
  • phpcms
  • 动易cms
  • phpwind
  • discuz
  • 科汛cms
  • 风讯cms
  • 建站教程
  • 运营技巧
您的位置:首页 > CMS教程 >建站教程 > 手把手教你在html中引入另一个html文件的方法(详解)

手把手教你在html中引入另一个html文件的方法(详解)

作者:站长图库 字体:[增加 减小] 来源:互联网 时间:2022-04-29

站长图库向大家介绍了html中引入,另一个html文件等相关知识,希望对您有所帮助

手把手教你在html中引入另一个html文件的方法(详解)


html中引入调用另一个html的方法,尝试了好几种,都列出来:

其中第一种是最好的,其他的方法,可以尝试看看,是不是适合你当前项目

一、p+$(“#page1”).load(“b.html”)

参考代码:

<body>    <p id="page1"></p>    <p id="page2"></p>    <script>        $("#page1").load("page/Page_1.html");        $("#page2").load("page/Page_2.html");    </script></body>

二、iframe

参考代码:

<head></head><body>    <p id="page1">        <iframe align="center" width="100%" height="170" src="page/Page_1.html"  frameborder="no" border="0" marginwidth="0" marginheight="0" scrolling="no"></iframe>    </p>    <p id="page2">        <iframe align="center" width="100%" height="170" src="page/Page_2.html"  frameborder="no" border="0" marginwidth="0" marginheight="0" scrolling="no"></iframe>    </p></body>

三、object引入

参考代码:

<head>    <object style="border:0px" type="text/x-scriptlet" data="page/Page_1.html" width=100% height=150></object></head>

四、import引入

参考代码:

<head>    <link rel="import" href="page/Page_1.html" id="page1"></head><body>    <script>        console.log(page1.import.body.innerHTML);    </script></body>

五、bootstrap的panel组件,或者easyui的window组件,有点类似这个效果.


感谢大家的阅读,希望大家收益多多。




分享到:QQ空间新浪微博腾讯微博微信百度贴吧QQ好友复制网址打印

您可能想查找下面的文章:

  • 手把手教你在html中引入另一个html文件的方法(详解)

相关文章

  • 2022-04-29CSS怎样让图片旋转又反转回来
  • 2022-04-29Phpcms V9 栏目图片调用方法
  • 2022-04-29在非Laravel项目中怎么使用Validator验证器
  • 2022-04-29无需借助其他软件或者插件实现Chrome网页长截图
  • 2022-04-29Photoshop数位板人物设计教程:《主教MM》
  • 2022-04-29uniapp中怎么实现直播旁路推流(步骤分享)
  • 2022-04-29帝国CMS二次开发领号发号功能开发思路
  • 2022-04-29微信小程序页面向下滚动时tab栏固定页面顶部实例讲解
  • 2022-04-29详细介绍mysql忘记密码的解决方案及修改密码的三种方式
  • 2022-04-29Photoshop制作燃烧效果的岩石字

文章分类

  • dedecms
  • ecshop
  • z-blog
  • UcHome
  • UCenter
  • drupal
  • WordPress
  • 帝国cms
  • phpcms
  • 动易cms
  • phpwind
  • discuz
  • 科汛cms
  • 风讯cms
  • 建站教程
  • 运营技巧

最近更新的内容

    • Photoshop使用素材制作唯美的花体字
    • Photoshop设计炫丽的抽象光线背景教程
    • 如何使用thinkphp5.1的数组查询对象
    • JavaScript如何处理并行请求?四种方式浅析
    • 一起来聊聊JavaScript函数柯里化
    • ThinkPHP5把动态链接库赋给变量而导致的执行多条sql数据合并问题
    • PHP生成小程序二维码乱码怎么办
    • 一文讲解Linux/UNIX上yum如何安装MySQL
    • Photoshop制作逼真复古效果的黑胶唱片
    • 如何解决centos6终端乱码问题

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有