A super simple greasemonkey script!

A super simple greasemonkey script!

I have been fascinated by the oil monkey script for a long time, and I have never had time to study it. I found a few blogs and found that it is not difficult to implement a simple script! For the first time learning, I imitated a demo script of CSDN one-click likes and comments, thanks to the original author!

Original blog post link: How to develop a greasemonkey script - Write a greasemonkey script from scratch .

The final effect :

click and 自动点赞enjoy 评论!

1. What is a oil monkey

Tampermonkey, this is a great Chrome extension.
Tampermonkey can change the CSS and JS elements of the page by loading third-party script files, which can make the whole web page look different, and can also add additional functions to the web page.
Of course, Chrome can also load third-party script files natively, but it is not as well supported as Tampermonkey. In addition to providing better support for script files, Tampermonkey also has the function of Tamperfire, which can find suitable script files according to the site.

Simply put, it is to let the browser run the Javascript written by yourself, so as to realize some page functions!

2. How to download

If you have scientific tools, go directly to the chrome extended search, if you don’t have tools, go to https://chrome.zzzmh.cn/ . Search and download.

3. How to develop your own script

1, Addition new script

Click GreaseMonkey Scripts in the extension to add a new script.

2. The meaning of the header statement

The newly created script is actually a js file with some declarations in the head

3. Write the script

create button

Button style:

  var styleMap = {
    
    
    display: "inline-block",
    "background-color": "red",
    cursor: "pointer",
    "user-select": "none",
    "min-width": "74px",
    height: "28px",
    "border-radius": "16px",
    color: "#fff",
    "font-size": "14px",
    "line-height": "28px",
    "text-align": "center",
    padding: "0px 10px",
    "margin-left": "16px",
  };
  // 创建按钮
  var btn = document.createElement("div");
  btn.innerHTML = "一键点赞评论";

  // 添加样式
  for (let i in styleMap) {
    
    
    btn.style[i] = styleMap[i];
  }

put in the corresponding position

Check the page, you can find the class name of the toolbox below,

it’s easy to know the location!

  var toolbox = document.querySelector(".toolbox-right");
  // 按钮添加到toolbox中
  toolbox.appendChild(btn);

Add click event

We need to help us complete the like operation and make a friendly comment when we click the button! It is definitely necessary to obtain the element to be clicked, enter comments, etc., which are actually similar operations to obtain DOM elements.
Regarding comments, we need to define an array for randomization, put the comment template into it, and randomize every time!

  var commentList = [
    "针不戳呀，写的针不戳！",
    "分享技术，不错哦!",
    "大佬牛批，写的很详细！",
    "感谢博主，你的文章让我得到一些收获！(￣ˇ￣)",
  ];
   // 随机 index（底下会处理为整数）
   var randomNum = Math.random() * 4;

Event triggered on button click:

// 添加点击事件
  btn.addEventListener("click", clickBtn);

  function clickBtn() {
    
    
  	// 点赞按钮
    var isLike = document.querySelector("#is-like");
    isLike.click();
	// 评论
    var comment_content = document.querySelector("#comment_content");
    comment_content.click();
    // 随机评论
    comment_content.value = commentList[~~randomNum];
	// 点击发表按钮（偷懒直接用的属性选择器hhh）
    var submit = document.querySelector("[value='发表评论']");
    submit.click();
  }

At this point, a simple script is almost finished! Recommended ads on the right! Claws!

  // 移除推荐广告
  var ad = document.querySelector("#recommendAdBox");
  ad.parentNode.removeChild(ad);

block certain sites

Add the following code, the script will not run in my personal blog!

// @exclude		 https://blog.csdn.net/weixin_54858833/article/details/*

Attach all codes:

// ==UserScript==
// @name         CSDN_Auto_Comment
// @namespace    http://maxcool.buzz
// @version      0.1
// @description  CSDN一键点赞评论（学习）
// @author       maxcool
// @match        https://blog.csdn.net/*/article/details/*
// @include		 https://blog.csdn.net/*/article/details/*
// @exclude		 https://blog.csdn.net/weixin_54858833/article/details/*
// @grant        none
// ==/UserScript==
(function() {
    
    
    'use strict';

      var styleMap = {
    
    
        display: "inline-block",
        "background-color": "red",
        cursor: "pointer",
        "user-select": "none",
        "min-width": "74px",
        height: "28px",
        "border-radius": "16px",
        color: "#fff",
        "font-size": "14px",
        "line-height": "28px",
        "text-align": "center",
        padding: "0px 10px",
        "margin-left": "16px",
      };
      var commentList = [
          "针不戳呀，写的针不戳！",
          "分享技术，不错哦!",
          "大佬牛批，写的很详细！",
          "感谢博主，你的文章让我得到一些收获！(￣ˇ￣)",
      ];

  var randomNum = Math.random() * 4;
  console.log("randomNum", ~~randomNum);

     // 移除广告
     var ad = document.querySelector("#recommendAdBox");
    ad.parentNode.removeChild(ad)

      // 创建按钮
      var btn = document.createElement("div");
      btn.innerHTML = "一键点赞评论";

      // 添加样式
      for (let i in styleMap) {
    
    
        btn.style[i] = styleMap[i];
      }

      // 添加点击事件
      btn.addEventListener("click", clickBtn);

      function clickBtn() {
    
    

        var isLike = document.querySelector("#is-like");
        isLike.click();

        var comment_content = document.querySelector("#comment_content");
        comment_content.click();
        comment_content.value = commentList[~~randomNum];

        var submit = document.querySelector("[value='发表评论']");
        submit.click();
      }

      var toolbox = document.querySelector(".toolbox-right");

      // 追加到 toolbox
      toolbox.appendChild(btn);
})();

that's all!