首页前端开发HTMLHTML5公共页面提取作为公用代码的方法

HTML5公共页面提取作为公用代码的方法

时间2024-01-25 04:05:27发布访客分类HTML浏览1001
导读:收集整理的这篇文章主要介绍了HTML5公共页面提取作为公用代码的方法,觉得挺不错的,现在分享给大家,也给大家做个参考。 在网站制作中有很多部分的代码是相同的,如footer部分,可以把这段代码提取出来,在别的页面调用。index....
收集整理的这篇文章主要介绍了HTML5公共页面提取作为公用代码的方法,觉得挺不错的,现在分享给大家,也给大家做个参考。

在网站制作中有很多部分的代码是相同的,如footer部分,可以把这段代码提取出来,在别的页面调用。

index.htML

!-- 底部加载外部文件 -->
        footer class="footer">
        /footer>
        script>
        $('.footer').load('conment/foot.html',function(responseTxt,statusTxt,xhr){
            console.LOG('responseTxt,statusTxt,xhr')            // console.log(responseTxt)            // console.log(statusTxt)            // console.log(xhr)        }
    )    /script>
    

foot.html

html lang="en">
    head>
        tITle>
    Document/title>
        link rel="stylesheet" href="css/foot.css">
    /link>
    /head>
    body>
        .../body>
    /html>
    

重点:

$('.footer').load()调用时必须在服务器环境中打开HTML文件才能成功,不能直接双击打开

打开后浏览器的路径应该是http://127.0.0.1:8020/index.html,

而不是file:///G:/html/index.html这样的路径,否则在大部分的浏览器上都无法使用。

在此建议使用HBuilder这款编辑器,在运行时会创建服务器环境,并且在局域网中在别的手机或电脑上预览。

到此这篇关于HTML5公共页面提取作为公用代码的方法的文章就介绍到这了,更多相关HTML5公共页面提取为公用代码内容请搜索以前的文章或继续浏览下面的相关文章,希望大家以后多多支持!

声明:本文内容由网友自发贡献,本站不承担相应法律责任。对本内容有异议或投诉,请联系2913721942#qq.com核实处理,我们将尽快回复您,谢谢合作!

上一篇: HTML5开发动态音频图的实现下一篇:HTML5中在title标题标签里设置小...猜你在找的html5相关文章 关于移动端h5开发相关内容总结2022-05-17html5教程-学表单的第二天2018-12-10html5教程-HTML5浏览器支持2018-12-10html5教程-HTML5智能表单2018-12-10html5教程-微信H5使用resLoader实现加载页效果2018-12-10html5教程-day01-初级-JS0-热身运动JS入门教程2018-12-10html5教程-html5shiv.js和respond.min.js2018-12-10html5教程-不同浏览器对于html5 audio标签和音频格式的兼容性2018-12-10html5教程-使用Html5实现手风琴案例2018-12-10html5教程-html5笔记2018-12-10 其他相关热搜词更多phpjavapython程序员load

若转载请注明出处: HTML5公共页面提取作为公用代码的方法
本文地址: https://pptw.com/jishu/586111.html
HTML5拖放API实现自动生成相框功能 HTML5开发动态音频图的实现

游客 回复需填写必要信息