☰

贴吧主页顶部显示楼层列表

让电脑端贴吧使用起来更便利点.增加了顶部楼层列表，跳转按钮

目前为 2022-03-06 提交的版本。查看 最新版本。

  1. // ==UserScript==
  2. // @name         贴吧主页顶部显示楼层列表
  3. // @namespace    http://tampermonkey.net/
  4. // @version      0.5
  5. // @description  让电脑端贴吧使用起来更便利点.增加了顶部楼层列表，跳转按钮
  6. // @include      http*://tieba.baidu.com/p/*
  7. // @include      http*://tieba.baidu.com/f?*
  8. // @include      http*://tieba.baidu.com/f/good?kw=*
  9. // @author       shitianshiwa
  10. // @grant        none
  11. // @run-at       document-idle
  12. // @license      MIT
  13. // ==/UserScript==
  14. /*能兼容这个链接了https://tieba.baidu.com/f/good?kw=xxxxxx&tab=good*/
  15. (function ($) {
  16.     'use strict';
  17.     var t1, t2, t3;
  18.     var hrefs = window.location.href;
  19.     const css1 = `
  20. /*按钮样式*/
  21. .miaocss01
  22. {
  23. display: inline-block;
  24. cursor: pointer;
  25. line-height: normal;
  26. text-decoration: none;
  27. padding: 5px 9px;
  28. font-size: 12px;
  29. background: #fff;
  30. color: #666;
  31. border: 1px solid #e6e6e6;
  32. }
  33. .miaocss02
  34. {
  35. display: inline-block;
  36. cursor: pointer;
  37. line-height: normal;
  38. text-decoration: none;
  39. padding: 5px 9px;
  40. font-size: 12px;
  41. background: #fff;
  42. color: #333;
  43. border: 1px solid #ccc;
  44. background-image: linear-gradient(to bottom,#fcfcfc 0,#f2f2f2 100%);
  45. }
  46. .miaocss03
  47. {
  48. position: relative;
  49. top:0px;
  50. display: inline-block;
  51. width: 45px;
  52. height: 45px;
  53. font-size: 15px;
  54. font-family:"黑体";
  55. font-weight:bold;
  56. background: #ecf2fc;
  57. color: #89a0c5;
  58. border: 1px solid #e6e6e6;
  59. }
  60. .miaocss04
  61. {
  62. position: relative;
  63. top:-5px;
  64. display: inline-block;
  65. width: 48px;
  66. height: 48px;
  67. font-size: 15px;
  68. font-family:"黑体";
  69. font-weight:bold;
  70. background: #fff;
  71. color: #999;
  72. border: 1px solid #e6e6e6;
  73. }
  74. /*鼠标移动到按钮上显示的样式*/
  75. .miaocss01:hover,.miaocss02:hover,.miaocss03:hover,.miaocss04:hover
  76. {
  77. background: #fff;
  78. color: #3e89fa;
  79. border: 1px solid #3e89fa;
  80. }
  81. `;
  82.     const style = document.createElement('style'); //创建新样式节点
  83.     style.textContent = css1; //添加样式内容
  84.     document.head.appendChild(style); //给head头添加新样式节点
  85.     //const text0='跳到 <input  class="miaojump1" type="text" style="width:40px;" value="1"/> 页&nbsp;<input  class="miaojump2" type="button" value="确定"/>';
  86.     function louceliebiao() {
  87.         try {
  88.             //clearTimeout(t2);
  89.             //1-------------------------------------------------
  90.             if (hrefs.split("?")[0].split("/")[3] == "f" || hrefs.indexOf("tab=album") == -1) //解决非主题列表和贴吧图片区报错
  91.             {
  92.                 if ($("input.miaojump2")[0] != null) //用来解决翻页后，上下楼层列表不一致的问题,删除上面的，然后再生成一次
  93.                 {
  94.                     if ($("input.miaojump2")[0].className == "miaojump2 miaocss01") //用跳转确认按钮的class来作条件
  95.                     {
  96.                         $("div.miaoliebiao").remove();
  97.                         //alert("45000000000000000");
  98.                     }
  99.                 }
  100.                 if ($("div.miaoliebiao")[0] == null) {
  101.                     if ($("#frs_list_pager").html() != null) {
  102.                         let text1 = '<div class="miaoliebiao"><div id="frs_list_pager" class="pagination-default clearfix" style="position:relative;left:1px;width:968px;background: #FEFEFE;border:1px solid #e4e6eb;padding:5px;">&nbsp;&nbsp;&nbsp;&nbsp;' + $("#frs_list_pager").html() + '</div></div>';
  103.                         if (hrefs.indexOf("/f/good?kw=") != -1) {
  104.                             $("div.nav_wrap ").after(text1); //专门给https://tieba.baidu.com/f/good?kw=XXXXX用的
  105.                         } else {
  106.                             $("div.head_content").append(text1); //电脑端贴吧主页主题贴列表顶部增加楼层列表
  107.                         }
  108.                         //给复制的按钮注册(不可用)动态加载功能
  109.                         $("div.miaoliebiao>#frs_list_pager").on("click", "a", function () {
  110.                             var i = $.tb.unescapeHTML($(this).tbattr("href"));
  111.                             return Bigpipe.broadcast("router_handle", {
  112.                                 url: i
  113.                             }), !1
  114.                         })
  115.                         $("div.thread_list_bottom>#frs_list_pager").on("click", "a", function () {
  116.                             var i = $.tb.unescapeHTML($(this).tbattr("href"));
  117.                             return Bigpipe.broadcast("router_handle", {
  118.                                 url: i
  119.                             }), !1
  120.                         })
  121.                     }
  122.                 }
  123.                 $("div.pagination-default").children("a").each(
  124.                     function () //主题贴列表
  125.                     {
  126.                         let a = false;
  127.                         for (let i = 0; i < $(this)[0].classList.length; i++) {
  128.                             //alert($(this)[0].classList[i]);
  129.                             if ($(this)[0].classList[i] == "miaosuo01") //使用class来判断是否注册(不可用)过事件，如果注册(不可用)了就会检测到
  130.                             {
  131.                                 a = true;
  132.                                 break;
  133.                             }
  134.                         }
  135.                         //alert($(this)[0].className);
  136.                         if (a == false) {
  137.                             $(this)[0].classList.add("miaosuo01"); //添加class
  138.                             $(this).click(function () {
  139.                                 $("input.miaojump2").remove(); //跳转确认按钮
  140.                                 $("div.miaoliebiao").remove(); //上面的楼层列表
  141.                                 //alert("4500");
  142.                             });
  143.                         }
  144.                         //let a=$.data($(this)[0],"events");
  145.                         //a["click"];//在脚本管理器中没用
  146.                     });
  147.  
  148.                 //2--------------------------------------------------------
  149.                 $("div.frs_good_nav_wrap").children("span").children("a").each(
  150.                     function () //精品区列表按钮
  151.                     {
  152.                         //alert("2233");
  153.                         let a = false;
  154.                         for (let i = 0; i < $(this)[0].classList.length; i++) {
  155.                             //alert($(this)[0].classList[i]);
  156.                             if ($(this)[0].classList[i] == "miaosuo02") {
  157.                                 a = true;
  158.                                 break;
  159.                             }
  160.                         }
  161.                         if (a == false) {
  162.                             $(this)[0].classList.add("miaosuo02");
  163.                             $(this).click(function () {
  164.                                 // alert("6666");
  165.                                 clearInterval(t2); //清除计时器，反正网页跳转没有完成前，又自动添加楼层列表
  166.                                 $("div.miaoliebiao").remove();
  167.                                 t2 = setInterval(() => { louceliebiao(); }, 1000); //延迟1s工作
  168.                             });
  169.                         }
  170.                     });
  171.  
  172.                 //3--------------------------------------------------
  173.                 $("input.miaojump2").each(
  174.                     function () //跳转楼层
  175.                     {
  176.                         let a = false;
  177.                         for (let i = 0; i < $(this)[0].classList.length; i++) {
  178.                             //alert($(this)[0].classList[i]);
  179.                             if ($(this)[0].classList[i] == "miaosuo03") {
  180.                                 a = true;
  181.                                 break;
  182.                             }
  183.                         }
  184.                         if (a == false) {
  185.                             $(this)[0].classList.add("miaosuo03");
  186.                             $(this).click(
  187.                                 function (event) {
  188.                                     //alert("3333");
  189.                                     //alert(String(event.target.previousElementSibling.value));//event.target.parentNode.childNodes.length-2
  190.                                     clearInterval(t2); //没有原因，反正先关掉计时器
  191.                                     let temp = window.location.href; //得到该网页的链接
  192.                                     if (temp.indexOf("pn") != -1) //用来解决链接无效变长问题，防止无限增加&pn=xxx，https://tieba.baidu.com/f?kw=xxxx&ie=utf-8&tp=0&pn=0&tp=0&pn=0&tp=0&pn=0&tp=0&pn=0
  193.                                     {
  194.                                         let temp2 = temp.split("&"); //字符串切割
  195.                                         let temp3 = temp2[0];
  196.                                         for (let i = 1; i < temp2.length - 1; i++) //字符串数组不要最后一个
  197.                                         {
  198.                                             temp3 = temp3 + "&" + temp2[i]; //字符串合成
  199.                                             //alert(temp2[i]);
  200.                                         }
  201.                                         //alert(temp3);
  202.                                         window.location.href = temp3 + "&pn=" + String(event.target.previousElementSibling.value - 1) * 50; //得到按钮所在地,前一个文本框的内容
  203.                                     } else {
  204.                                         window.location.href = temp + "&pn=" + String(event.target.previousElementSibling.value - 1) * 50;
  205.                                     }
  206.                                 });
  207.                             //alert($("#miaojump1")[0].value);
  208.                             //alert(String(window.location.href).split("&")[0]);
  209.                             //alert(String(window.location.href).split("&")[0]+"&pn="+String(($("#miaojump1")[0].value-1)*50));
  210.                         }
  211.                     });
  212.             }
  213.         } catch (error) {
  214.             clearInterval(t2);
  215.             alert(error + ",贴吧主页顶部显示楼层列表已停止运行");
  216.         }
  217.         try {
  218.             for (var i = 0; i < 2; i++) //楼层跳转输入框和确定按钮
  219.             {
  220.                 if ($("input.miaojump1")[i] == null && $("div.pagination-default")[0] != null) //只有class可以捕捉多个标签，id不行
  221.                 {
  222.                     let temp1 = document.createElement("input"); //创建节点<input/>
  223.                     temp1.setAttribute('class', 'miaojump1'); //为input添加属性<input class="miaojump1"/>
  224.                     temp1.setAttribute('type', 'text'); //<input class="miaojump1" type="text"/>
  225.                     temp1.setAttribute('style', 'width:40px;'); //<input class="miaojump1" type="text" style="width:40px;"/>
  226.                     temp1.setAttribute('value', '1'); //<input class="miaojump1" type="button" value="1" style="width:40px;"/>
  227.                     //---------------------------------------------------
  228.                     let temp2 = document.createElement("input"); //创建节点<input/>
  229.                     temp2.setAttribute('class', 'miaojump2 miaocss01'); //为input添加属性<input class="miaojump2 miaocss01"/>//贴吧自带的楼层跳转链接样式class为pagination-item
  230.                     temp2.setAttribute('type', 'button'); //<input  class="miaojump2 miaocss01" type="button"/>
  231.                     temp2.setAttribute('value', '确定'); //<input  class="miaojump2 miaocss01" type="button" value="确定"/>
  232.                     let temp3 = document.querySelectorAll("div.pagination-default");
  233.                     //---------------------------------------------------
  234.                     if (temp3[i] != null) {
  235.                         temp3[i].append(" 跳到: ");
  236.                         temp3[i].append(temp1); //添加跳转文本框和确认按钮
  237.                         temp3[i].append(" 页 ");
  238.                         temp3[i].append(temp2);
  239.                     }
  240.                 }
  241.             }
  242.             let temp = $("#frs_list_pager")[0];
  243.             if (temp != null) {
  244.                 temp.style = "position: relative;left: 1px; width: 968px;border: 1px solid #e4e6eb;padding: 5px;"; //兼容黑夜模式 https://userstyles.org/styles/161224/maverick-demo-styles
  245.  
  246.             }
  247.         } catch (error) {
  248.             clearInterval(t2);
  249.             alert(error + ",贴吧主页顶部显示楼层列表已停止运行_添加添加跳转文本框和确认按钮");
  250.         }
  251.     }
  252.     //louceliebiao();使用这个的话，重复切换楼层后，上面就不显示楼层列表了
  253.     t2 = setInterval(louceliebiao, 1000); //延迟1s工作，等网页基本加载完毕
  254.     //t2=setInterval(()=>{louceliebiao();},1000);//延迟1s工作，等网页基本加载完毕
  255.     var a = false
  256.     const action = (event) => {
  257.         //console.log(event.animationName)
  258.         const {
  259.             target
  260.         } = event;
  261.         const {
  262.             classList
  263.         } = target
  264.         //console.log(target.getAttribute("b"))
  265.         if (classList.contains("threadlist_title")) {
  266.             if (a == false && target.getAttribute("b") == null) {//使其只可以执行一次
  267.                 a = true
  268.                 //console.log(target)
  269.                 var parentNodex = document.getElementById('thread_list');
  270.                 if (parentNodex != null) {
  271.                     //console.log("test")
  272.                     $("input.miaojump2").remove(); //跳转确认按钮
  273.                     $("div.miaoliebiao").remove(); //上面的楼层列表
  274.                 }
  275.                 let t = setTimeout(() => {
  276.                     a = false
  277.                     clearTimeout(t)
  278.                     t = null
  279.                 }, 3000);
  280.             }
  281.         }
  282.         target.setAttribute('b', '1')
  283.     }
  284.     //https://www.sitepoint.com/css3-animation-javascript-event-handlers/
  285.     //https://developer.mozilla.org/zh-CN/docs/Web/CSS/CSS_Animations/Using_CSS_animations
  286.     /*
  287.     W3C standard	Firefox     	webkit	                Opera	        IE10
  288.     animationstart	animationstart	webkitAnimationStart	oanimationstart	MSAnimationStart
  289.     animationiteration	animationiteration	webkitAnimationIteration	oanimationiteration	MSAnimationIteration
  290.     animationend	animationend	webkitAnimationEnd	oanimationend	MSAnimationEnd
  291.     */
  292.     var pfx = ["webkit", "moz", "MS", "o", ""];
  293.  
  294.     function PrefixedEvent(element, type, callback) {
  295.         for (var p = 0; p < pfx.length; p++) {
  296.             if (!pfx[p]) type = type.toLowerCase();
  297.             //console.log(pfx[p] + type);
  298.             element.addEventListener(pfx[p] + type, callback, false);
  299.         }
  300.     }
  301.     PrefixedEvent(document, "AnimationStart", action); //开始
  302. })($);
  303. /*
  304. Jquery attr()方法 属性赋值和属性获取详解
  305. jquery中用attr()方法来获取和设置元素属性,attr是attribute（属性）的缩写，在jQuery DOM操作中会经常用到attr()，attr()有4个表达式。
  306.  
  307. 1.  attr( 属性名 )//获取属性的值（取得第一个匹配元素的属性值。通过这个方法可以方便地从第一个匹配元素中获取一个属性的值。如果元素没有相应属性，则返回 undefined ）
  308.  
  309. 2.  attr( 属性名, 属性值 )//设置属性的值 （为所有匹配的元素设置一个属性值。）
  310.  
  311. 3.  attr( 属性名 , 函数值 )//设置属性的函数值  （为所有匹配的元素设置一个计算的属性值。不提供值，而是提供一个函数，由这个函数计算的值作为属性值。）
  312.  
  313. 4. attr(properties)//给指定元素设置多个属性值，即：{属性名一: “属性值一” , 属性名二: “属性值二” , … … }。(这是一种在所有匹配元素中批量设置很多属性的最佳方式。 注意，如果你要设置对象的class属性，你必须使用'className' 作为属性名。或者你可以直接使用'class'或者'id'。)
  314.  
  315.     //var hrefx=window.location.href.split(":")[0];
  316.     //var p=window.location.href.split("/")[3];
  317. //4--------------------------------------------------
  318.         try
  319.         {
  320.             //4---------------------------------------------------
  321.             if($("input.miaotop")[0]==null&&$("input.miaobottom")[0]==null)//主题贴列表滚动条到底
  322.             {
  323.                 //$("div.miaoliebiao").children("div.pagination-default").append('    <input type="button" class="miaobottom  miaocss01" value="到网页底部"/>');//增加空格让按钮与前面的按钮隔开点
  324.                 if(hrefx=="https"||(hrefx=="http"&&p!="p"))
  325.                 {
  326.                     $("li.tbui_fbar_top").remove();//删掉贴吧自带的到顶
  327.                     $("ul.tbui_aside_float_bar").append('<input type="button" class="miaotop  miaocss03" value="到顶↑"/><br/>');//增加回车换行
  328.                     $("ul.tbui_aside_float_bar").append('<input type="button" class="miaobottom  miaocss03" value="到底↓"/>');
  329.                     event_registration();
  330.                 }
  331.                 else if(hrefx=="http"&&p=="p")
  332.                 {
  333.                     t3=setTimeout(delayed_action,1000);//延迟1s发动动作
  334.                 }
  335.  
  336.             }
  337.  
  338.             if($("input.miaobottom2")[0]==null&&$("ul.l_posts_num")[0]!=null)////主题贴滚动条到底
  339.             {
  340.                 //$("ul.l_posts_num")[0].append('    <input type="button" class="miaobottom2" value="到网页底部"/>');//为了可以定位添加节点(一键到底只有贴子顶部有用，一键到顶贴吧自带有)，所以使用下面的添加节点方法
  341.                 let temp2=document.createElement("input");
  342.                 let temp3=document.querySelectorAll("ul.l_posts_num");
  343.                 temp2.setAttribute('class','miaobottom2 miaocss02');//btn-sub btn-small贴吧自带的主题贴确定按钮样式
  344.                 temp2.setAttribute('type','button');
  345.                 temp2.setAttribute('style','position:relative;left:5px;');
  346.                 temp2.setAttribute('value','到网页底部');
  347.                 temp3[0].append(temp2);
  348.                 $("input.miaobottom2").click(function()
  349.                 {
  350.                     window.scrollTo(0,document.body.scrollHeight);
  351.                 });
  352.             }
  353.         }
  354.         catch(error)
  355.         {
  356.             alert(error+",主题贴列表滚动条到底未正常运行");
  357.         }
  358. function delayed_action()//延迟动作
  359.     {
  360.         clearTimeout(t3);
  361.         $("li.tbui_fbar_top").remove();//删掉贴吧自带的到顶
  362.         $("ul.tbui_aside_float_bar").append('<input type="button" class="miaotop  miaocss04" value="到顶↑"/><br/>');//增加回车换行
  363.         $("ul.tbui_aside_float_bar").append('<input type="button" class="miaobottom  miaocss04" value="到底↓"/>');
  364.         event_registration();
  365.     }
  366.     function event_registration()//事件注册(不可用)
  367.     {
  368.         $("input.miaotop").click(
  369.             function()
  370.             {
  371.                 window.scrollTo(0,0);//到顶
  372.             });
  373.         $("input.miaobottom").click(
  374.             function()//到底
  375.             {
  376.                 window.scrollTo(0,document.body.scrollHeight);
  377.             });
  378.     }
  379. */

欢迎访问Greasy Fork镜像

土豆服务器，请按需使用

镜像地址随时可能被墙，建议加群获取最新地址

加入Q群

QingJ © 2025

镜像随时可能失效，请加Q群300939539或关注我们的公众号极客氢云获取最新地址