文章界面测试

2022-11-0617 min 啥都不是

二级标题

test 我是测试

站内链接

站外链接

三级标题

blockquote

啊啊啊啊

error

二级标题

aaaaaaaaa 这只是测试内容这只是测试内容这只是测试内容 这只是测试内容这只是测试内容这只是测试内容这只是测试内容这只是测试内容这只是测试内容这只是测试内容这只是测试内容这只是测试内容这只是测试内容这只是测试内容这只是测试内容这只是测试内容这只是测试内容这只是测试内容

一段代码

new ClipboardJS(".code-copy-btn", {
  target: function (trigger) {
    var _a, _b;
    var el =
      (_b =
        (_a = trigger.parentElement) === null || _a === void 0
          ? void 0
          : _a.parentElement) === null || _b === void 0
        ? void 0
        : _b.parentElement;
    var ss = el.getElementsByTagName("pre")[0];
    return ss;
  },
});
document.oncopy = function () {
  message("复制成功,注意表明出处哦");
};
// lazy-load start
var io = new IntersectionObserver(function (items) {
  items.forEach(function (item) {
    if (item.isIntersecting) {
      var target = item.target;
      target.src = target.getAttribute("data-src");
      io.unobserve(target);
    }
  });
});
var imgLazyLoad = function () {
  document.querySelectorAll("img.lazy-load").forEach(function (item) {
    io.observe(item);
  });
};
// lazy-load end
// 防抖和节流
// 防抖
function debounce(func, delay) {
  var timer;
  return function () {
    var context = this;
    var args = arguments;
    clearTimeout(timer);
    timer.setTimeout(function () {
      func.apply(context, args);
    }, delay);
  };
}
//节流
function throttle(func, delay) {
  var timer;
  return function () {
    var context = this;
    var args = arguments;
    if (timer) {
      return;
    }
    timer = setTimeout(function () {
      func.apply(context, args);
      timer = null;
    }, delay);
  };
}
// 结束
// 全局信息提示
var message = function (msg) {
  // 替换message
  document.getElementById("message-toast").innerHTML = msg;
  // 生成toast
  var toastLive = document.getElementById("liveToast");
  var toast = new bootstrap.Toast(toastLive, { delay: 3000 });
  toast.show();
};
var code_highlight = function () {
  var pre = document.querySelectorAll("pre");
  pre.forEach(function (item) {
    item.classList.add("line-numbers", "mac-dot", "rounded");
  });
};
tocbot.init({
  tocSelector: "#art-toc",
  contentSelector: "#article",
  headingSelector: "h2, h3, h4",
  hasInnerContainers: true,
});

sss

test 2
test 3
test 4
## test 5
var a = 5
    a = 4

一张图片

<!-- 图片什么都不带,这样可能会导致懒加载时页面的抖动(因为不知道宽高信息), 我们不推荐这样的写法 -->

![图片什么都不带](https://as.gmero.com/pic/2023/10/27/20231027212336.png?size=small)

<!-- 图片带有宽高信息, 你可以使用 width/hight 或者 widthxhight 来指明宽高  -->

![图片带有宽高信息](https://as.gmero.com/pic/2023/10/27/20231027212336.png?size=small "217/73")

<!-- 如果 / 与 x 形式的宽高同时存在, 那么 / 被认为是缩略图的宽高, x 代表灯箱插件所需要的原图宽高 -->

![带缩略图的形式](https://as.gmero.com/pic/2023/10/31/picography-standing-with-skateboard.jpg?size=small "700/467 4460x2973")

<!-- 你有可能也需要设置title 我们会自动将除宽高外的字符串设置为图片的title -->

![完整的图片](https://as.gmero.com/pic/2023/10/31/piqsels.com-id-frrow.jpg?size=small "700/298 2200x936 这是一张夜景图片")

图片只带有宽高信息:

图片带有宽高信息

图片带有本身宽高和原图宽高信息:

带缩略图的形式

图片带有包含 title 的所有信息:

完整的图片

出错的图片:

error img

表格

SyntaxDescription
HeaderTitle
ParagraphText
评论
正在加载评论组件...