Tampermonkey 简介

2020-07-13  本文已影响0人  wwq2020

简介

Tampermonkey可以用来写一些用户脚本,这里demo我们用来监听dom变化,因为编写爬虫程序时候我们往往找到了数据源,但是还需要找到修改他的地方

准备

安装 chrome 插件 Tampermonkey

创建 Tampermonkey 脚本

// ==UserScript==
// @name         New Userscript
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  try to take over the world!
// @author       You
// @match        http://127.0.0.1:9091
// @grant        none
// ==/UserScript==

(function() {
    'use strict';
new MutationObserver((mutations, observer) => {
  const el = document.getElementById("demo2");
  if (el != null) {
    observer.disconnect()
    new MutationObserver((mutations, observer) => {
      debugger
    }).observe(el, {childList: true, subtree: true,attributes: true})
  }
}).observe(document, {childList: true, subtree: true,attributes: true})
})();

创建 server.go,内容如下

package main

import (
    "io"
    "net/http"
)

var (
    data = `<html>
<body>
<p id="demo2">demo2</p>
  <div id="demo"></div>
  <button onclick="onClick()">aaaaa</button>
  <script>
    function onClick() {
      let child = document.createElement("p");
      child.innerHTML = "aaa";
      let el = document.getElementById("demo");
      el.appendChild(child);
      let el2 = document.getElementById("demo2");
      el2.innerHTML = "demo";
    }
  </script>
</body>
</html>
    `
)

func main() {
    http.HandleFunc("/", func(w http.ResponseWriter, r *http.Request) {
        io.WriteString(w, data)
    })
    http.ListenAndServe(":9091", nil)
}

测试

访问http://127.0.0.1:9091,点击按钮,
看到


image.png
上一篇下一篇

猜你喜欢

热点阅读