y_method

自分用。dom取得・操作機能追加

このスクリプトは単体で利用できません。右のようなメタデータを含むスクリプトから、ライブラリとして読み込まれます: // @require https://update.greasyfork.org/scripts/419955/1051149/y_method.js

このスクリプトの質問や評価の投稿はこちら通報はこちらへお寄せください。
  1. // ==UserScript==
  2. // @name y_method
  3. // @version 0.3.1
  4. // @description dom取得等の機能追加
  5. // @author y_kahou
  6. // ==/UserScript==
  7. const y_method = {
  8. /**
  9. * スタイルを追加する
  10. * @param id {string} - スタイルのID
  11. * @param css {string} - css本体
  12. */
  13. addStyle: function(id, css) {
  14. let style = document.createElement('style')
  15. style.id = id
  16. style.setAttribute('type', 'text/css')
  17. style.textContent = css
  18. document.querySelector('head').appendChild(style)
  19. },
  20. /**
  21. * 対象までスクロールせずにクリックする
  22. * @param selector {string} - 取得対象のセレクタ
  23. */
  24. click_: function(element) {
  25. let x = window.scrollX, y = window.scrollY
  26. element.click()
  27. window.scrollTo(x, y)
  28. },
  29. /**
  30. * 対象までスクロールせずにフォーカスする
  31. * @param selector {string} - 取得対象のセレクタ
  32. */
  33. focus_: function(element) {
  34. let x = window.scrollX, y = window.scrollY
  35. element.focus()
  36. window.scrollTo(x, y)
  37. },
  38. /**
  39. * 対象のdomを取得できるまで取得を挑戦する
  40. * @param selector {string} - 取得対象のセレクタ
  41. * @param interval {number} - 次の挑戦までの時間ms
  42. * @param repeat {number} - 繰り返し回数
  43. */
  44. repeatGetElements: function(selector, interval = 500, repeat = 60) {
  45. return new Promise(function(resolve, reject) {
  46. let cnt = 0
  47. let it = setInterval(function() {
  48. if (++cnt > repeat) {
  49. clearInterval(it)
  50. reject("Could'n get " + selector)
  51. }
  52. let ret = document.querySelectorAll(selector)
  53. if (ret.length > 0) {
  54. clearInterval(it)
  55. resolve(ret)
  56. }
  57. }, interval)
  58. })
  59. },
  60. /**
  61. * src込みのvideo要素の取得
  62. */
  63. getVideo: async function(selector = 'video') {
  64. let video
  65. for (var i = 0; i < 60; i++) {
  66. video = await repeatGetElements(selector)
  67. if (video[0].getAttribute('src'))
  68. break
  69. await wait(500)
  70. }
  71. return video
  72. },
  73. /**
  74. * ファイル名に使えない文字を半角から全角へ変換する
  75. * @param name {string} - ファイル名
  76. */
  77. filenameEscape: function(name) {
  78. const target = ['\\', '/', ':', '*', '?', '"', '<', '>', '|', ]
  79. const rep = ['\', '/', ':', '*', '?', '”', '<', '>', '|', ]
  80. let ename = name
  81. for (let i = 0; i < target.length; i++) {
  82. ename = ename.replaceAll(target[i], rep[i])
  83. }
  84. return ename
  85. },
  86. /**
  87. * pagetransitionイベントを発火
  88. * target: document
  89. * event: pagetransition
  90. */
  91. TriggerPagetransition: function() {
  92. const event = new CustomEvent('pagetransition', { detail: location.href });
  93. document.dispatchEvent(event);
  94. },
  95. /**
  96. * SPA等のページ遷移をイベントで検知できるようにする
  97. * target: document
  98. * event: pagetransition
  99. */
  100. DetectPagetransition: function() {
  101. let agoHref = location.href;
  102. new MutationObserver(() => {
  103. if (agoHref != location.href) {
  104. y_method.TriggerPagetransition();
  105. agoHref = location.href;
  106. }
  107. })
  108. .observe(document.body, { childList: true, subtree: true ,attributes: true })
  109. },
  110. /**
  111. * 指定のページごとのcssと初期動作関数List
  112. * @param launcherList [{match, css, run},]
  113. * @param match url RegExp
  114. * @param css css text
  115. * @param run function
  116. */
  117. PageLauncher: function(launcherList) {
  118. document.addEventListener('pagetransition', e => {
  119. for (const s of document.querySelectorAll('.spa-style')) {
  120. s.outerHTML = '';
  121. }
  122. for (const d of launcherList) {
  123. if (new RegExp(d.match).test(location.href)) {
  124. let style = document.createElement('style')
  125. style.className = 'spa-style'
  126. style.setAttribute('type', 'text/css')
  127. style.textContent = d.css
  128. document.head.appendChild(style)
  129. if (d.run && typeof d.run === 'function') d.run();
  130. }
  131. }
  132. })
  133. },
  134. }
  135. if (window.jQuery) (function($) {
  136. /**
  137. * 対象までスクロールせずにクリックする
  138. */
  139. $.fn.click_ = function() {
  140. y_method.click_(this[0])
  141. return this
  142. }
  143. /**
  144. * 対象までスクロールせずにフォーカスする
  145. */
  146. $.fn.focus_ = function() {
  147. y_method.focus_(this[0])
  148. return this
  149. }
  150. })(window.jQuery);