美文网首页
如何快速复制一个网站内容和样式

如何快速复制一个网站内容和样式

作者: webmrxu | 来源:发表于2020-06-17 23:20 被阅读0次

原理:把整个网页中元素的样式全部改为内连样式。
使用方式:
1、打开浏览器控制台。
2、运行以下脚本。
3、复制控制台输出。
4、新建一个html 文件,将复制的内容copy 到这个文件中。
5、浏览器中打开html文件就可看到该网站内容。

注意:该方式复制的只是静态样式,不包含功能。

let select = 'body'
if(!window.$ || !window.jQuery) {
  var x = document.createElement("SCRIPT");
  x.setAttribute('src','https://code.jquery.com/jquery-2.2.4.min.js')
  document.body.appendChild(x);
  setTimeout(startRenderEl, 2000)
} else {
  startRenderEl()
}
function startRenderEl() {
  let styles = [
    'color','background','width',
    'height','fontSize','lineHeight', 'margin', 
    'padding','position', 'float','right',
    'bottom','top','left', 'display','border',
    'borderTop','borderBottom','borderLeft','borderRight',
    'cursor','overflow','boxSizing','borderColor',
    'borderRadius','textDecoration','listStyle',
   'textAlign'
  ]
  dealItemEl(select)
  $(select+' *').each((index, el) => {
    dealItemEl(el)
  })
  function dealItemEl(el) {
    if (typeof el === 'string') {
      el = $(el)
    }
    if (el instanceof jQuery) {
      el = el[0]
    }
    let styleObj = window.getComputedStyle(el)
    styles.forEach(v => {
      if (styleObj[v]) {
        $(el).css(v, styleObj[v])
      }
    })
  }
  let content = $('<div>').append($(select).clone()).html();
  console.log(content)
}

相关文章

  • 如何快速复制一个网站内容和样式

    原理:把整个网页中元素的样式全部改为内连样式。使用方式:1、打开浏览器控制台。2、运行以下脚本。3、复制控制台输出...

  • 网页禁止复制的实现方法

    我们经常在某些网站上复制内容的时候发现,竟然复制不了。友好的交互还会弹窗告诉你,登陆后才能复制哦。那么网站是如何阻...

  • chrome调试键盘事件&使页面不可复制的方法

    遇到一个网站,想要对其内容进行复制,发现复制不了。 在网上找了一圈:如何在页面中禁用复制。发现是用 js 来对按键...

  • 整理新闻标题和时间

    一:如何把网站内容导入Excel表 1.去官网复制第一个时间,到Excel中粘贴,刷新Web查询,把网站内容全部导...

  • 如何在Gitbook上合并单元格

    第一,先在Excel或者word上编辑好你需要的样式 第二,将Excel内容复制到这个网站上http://pres...

  • web复制黏贴中添加额外信息

    有时候我们需要在用户复制网站内容时,给复制的内容加上一些而外的信息,比如网站和作者,起到维护版权和宣传的作用,这个...

  • jQuery节点操作

    添加元素 html创建元素 清空元素 复制元素 属性操作 值和内容 其他样式操作

  • 网站快速获得网站权重的方法

    如何让网站快速获得网站权重 百度算法不断更新,如何才能保证自己的网站能够随波逐流,不被淘汰?只要记住一句话:“内容...

  • 为何网站会出现多个重复内容页面?

    网站复制内容也可以称为重复内容,复制内容指的是两个或者多个URL内容相同,或非常相似。重复内容既可能发生在同一个网...

  • js中富文本清除复制内容样式问题

    场景:当我们在使用富文本需要复制富文本内容的时候,却不希望富文本中的样式和标签被一起复制。

网友评论

      本文标题:如何快速复制一个网站内容和样式

      本文链接:https://www.haomeiwen.com/subject/hztzectx.html