//定义网页源码

str = '<!DOCTYPE html><html><head> <meta charset="UTF-8"></head><body style="backgroud-color:yellow"><div>文章</div></body></html>';

//定义正则式，匹配body部分，并把body内部代码用()包起来，代表子表达式$1
reg=/<body[^>]*>([\s\S]*)<\/body>/;

//获取匹配结果，第二个元素刚好是子表达式$1的值
content = str.match(reg)[1];

输出： "<div>文章</div>"

//获取匹配结果的外层代码
outer = str.replace(content,'');
输出："<!DOCTYPE html><html><head> <meta charset="UTF-8"></head><body style="backgroud-color:yellow"></body></html>"

//外层代码切割

法一：

bodyTailIndex = outer.indexOf('</body>');

outerTail = outer.substring(bodyTailIndex);
输出："</body></html>"

outerHead = outer.substring(0,bodyTailIndex);
输出："<!DOCTYPE html><html><head> <meta charset="UTF-8"></head><body style="backgroud-color:yellow">"

法二：

outerPart = str.split(content)

js分离html代码的body内外部分的更多相关文章

  1. 玩转JS系列之代码加载篇

    从前我们这样写js <script type="text/javascript"> function a(){ console.log('a init');}funct ...

  2. html与JacaScript中的重要思想：预留后路、向后兼容、js分离

    以一个简单的web程序为例 详细设计模式请配合代码及凝视食用 <!DOCTYPE html> <!-- 1 预留退路:假设用户禁用了js.链接还能正常显示吗?(href) 2 分离j ...

  3. 如何让css与js分离

    在 webpack 我们如何让 css 与 js 分离: 我们需要安装插件:extract-text-webpack-plugin 1. 用:npm 下载插件 npm install extract- ...

  4. 记录一次用宝塔部署微信小程序Node.js后端接口代码的详细过程

    一直忙着写毕设,上一次写博客还是元旦,大半年过去了.... 后面会不断分享各种新项目的源码与技术.欢迎关注一起学习哈! 记录一次部署微信小程序Node.js后端接口代码的详细过程,使用宝塔来部署. 我 ...

  5. JS Nice – JavaScript 代码美化和格式化工具

    JS Nice 是一款让经过混淆处理的 JavaScript 代码可读更好的工具.它使用一种新型的用于 JavaScript 代码美化的去混淆和去压缩引擎.JSNice 采用先进的机器学习和程序分析技 ...

  6. ios-UIWebView中js和oc代码的互调

    webview是ios中显示远程数据的网页控件,webview能显示的内容很多,MP4.文本.pdf等等: 关于js和oc代码的互相调用 1:oc中调用js代码; >>oc中调用js代码很 ...

  7. 关于JS的一些代码效果图

    关于JS的一些代码效果图 1.几乎所有DOM元素都有innerText.innerHTML属性(注意大小写),分别是元素标签内内容的文本表示形式和HTML源代码,这两个属性是可读可写的. 需要注意的是 ...

  8. js基础 - 兼容代码

    js基础 - 兼容代码 . scrollTop . chrome document.body.scrollTop . IE && firefox document.documentEl ...

  9. [转]Asp.Net调用前台js调用后台代码分享

    1.C#前台js调用后台代码 前台js <script type="text/javascript" language="javascript"> ...

随机推荐

  1. 移动web之一像素问题

    一.为什么会有一像素问题 弄明白这个问题,首先要知道DPR了. DPR(device pixel ratio)pixel等于picture element.设备像素比,是默认缩放100%的情况下,即D ...

  2. 04. H5标签有哪些？行内元素有哪些？块级元素有哪些？空(void)元素有哪些？行内元素和块级元素有什么区别？你工作中常用标签有什么？

    4. H5标签有哪些? 2)行内元素有哪些? a - 锚点 em - 强调 img - 图片 font - 字体设定 ( 不推荐 ) i - 斜体 input - 输入框 3)块级元素有哪些? add ...

  3. [BZOJ4204] 取球游戏（期望）

    DarkBZOJ4204 (题面来源) [题目描述] 有\(m\)个球,一开始每个球均有一个初始标号,标号范围为\(1-n\)且为整数,标号为\(i\)的球有\(a_{i}\)个,并保证\(Σa_{i ...

  4. Pycharm快捷键配置

    1.主题 毫无疑问Pycharm是一个具有强大快捷键系统的IDE,这就意味着你在Pycharm中的任何操作,例如打开一个文件.切换编辑区域等,都可以通过快捷键来实现.使用快捷键不仅能提高操作速度,看起 ...

  5. Struts2和SpringMVC的action是单例还是原型的？

    struts2的acion单独使用的时候应是多例的,也就是原型(prototype). 因为它是基于类开发的,它的三种获取页面传参的方式都是通过成员变量的方式来接受的. 如果用struts2框架基于方 ...

  6. idea使用时，部分jdk的jar包（tool.jar com.sun.javadoc) 无法引入-gradle处理方案

    gradle 增加配置 def jdkHome = System.getenv("JAVA_HOME") dependencies { compile files("$j ...

  7. UVALive - 6436、HYSBZ - 2435 (dfs)

    这两道题都是用简单dfs解的,主要是熟悉回溯过程就能做,据说用bfs也能做 道路修建(HYSBZ - 2435) 在 W 星球上有n 个国家.为了各自国家的经济发展,他们决定在各个国家 之间建设双向道 ...

  8. iview 之 穿梭框 transfer

    概述 双栏穿梭选择框,常用于将多个项目从一边移动到另一边. 说明 Transfer 组件主要基于以下四个 API 来使用: :data:总体数据,数组,每项为一个对象,且必须含有 key 值,组件基于 ...

  9. CSAPP阅读笔记-struct, union, 数据对齐-来自第三章3.9的笔记-P183-P191

    1.数据对齐 为什么要对齐:通俗点解释就是CPU对数据访问时,每次都是取固定数量的字节数,假如一次取4个字节,若有个int存在0x01-0x04,则一次就能取出,若存在0x03-0x06,则需要分两次 ...

  10. JDBC（4）-Result结果集

    1.Result结果集的引入 当我们查询数据库时,返回的是一个二维的结果集,我们这时候需要使用ResultSet来遍历结果集,获取每一行的数据. 2.使用Result遍历查询结果 boolean ne ...