返回

油猴脚本掘金Markdown格式适配器知识点记录

前端

1. 正则表达式

正则表达式是用来匹配字符串的模式,它可以用来查找、替换、分割字符串,还可以用来验证字符串的格式。在油猴脚本中,正则表达式可以用RegExp对象来表示,RegExp对象的构造函数可以接受两个参数:正则表达式模式和修饰符。

正则表达式模式是一个字符串,它可以使用特殊字符来匹配不同的字符或字符串。例如,.可以匹配任意一个字符,*可以匹配任意数量的字符,+可以匹配一个或多个字符,?可以匹配零个或一个字符。

修饰符是一个字符串,它可以用来指定正则表达式的一些特殊行为。例如,i修饰符可以使正则表达式忽略大小写,g修饰符可以使正则表达式进行全局匹配。

2. tooltip效果

tooltip效果是一种当鼠标悬停在某个元素上时显示提示信息的效果。在油猴脚本中,可以使用tooltip库来实现tooltip效果。tooltip库是一个第三方库,需要通过<script>标签引入到油猴脚本中。

<script src="https://cdn.bootcss.com/tooltipster/4.2.4/js/tooltipster.bundle.min.js"></script>

引入tooltip库后,就可以使用tooltip函数来为元素添加tooltip效果。tooltip函数的第一个参数是元素的CSS选择器,第二个参数是tooltip的内容,第三个参数是tooltip的一些可选设置。

$("selector").tooltipster({
  content: "This is a tooltip",
  position: "top"
});

3. input标签样式的自定义

input标签的样式可以通过CSS来自定义。在油猴脚本中,可以使用style标签来定义CSS样式。

<style>
input[type="text"] {
  width: 200px;
  height: 30px;
  border: 1px solid #ccc;
  padding: 5px;
}
</style>

4. 插入或创建SVG

SVG是一种矢量图形格式,它可以用来创建各种各样的图形。在油猴脚本中,可以使用document.createElementNS()函数来创建SVG元素。

var svg = document.createElementNS("http://www.w3.org/2000/svg", "svg");
svg.setAttribute("width", "100");
svg.setAttribute("height", "100");

创建SVG元素后,就可以使用appendChild()函数将它添加到文档中。

document.body.appendChild(svg);

5. 模拟用户输入

在油猴脚本中,可以使用dispatchEvent()函数来模拟用户输入。dispatchEvent()函数的第一个参数是事件类型,第二个参数是事件对象。

var event = new KeyboardEvent("keydown", {
  key: "Enter"
});
document.dispatchEvent(event);

6. 文件读取接口及文件对象

在油猴脚本中,可以使用FileReader接口来读取文件。FileReader接口的readAsText()方法可以将文件的内容读入内存。

var reader = new FileReader();
reader.onload = function() {
  var text = reader.result;
};
reader.readAsText(file);

FileReader接口的result属性包含了文件的内容。