☰

JavaScript网络执行器

轻松执行JavaScript！

当前为 2024-09-09 提交的版本，查看 最新版本。

  1. // ==UserScript==
  2. // @name         JavaScript Web Executor
  3. // @name:fr      Exécuteur Web JavaScript
  4. // @name:es      Ejecutor Web de JavaScript
  5. // @name:de      JavaScript-Web-Executor
  6. // @name:zh-CN   JavaScript网络执行器
  7. // @name:ru      JavaScript Веб-Исполнитель
  8. // @description  Execute JavaScript with ease!
  9. // @description:fr Exécutez JavaScript facilement!
  10. // @description:es Ejecuta JavaScript con facilidad!
  11. // @description:de Führen Sie JavaScript mühelos aus!
  12. // @description:zh-CN 轻松执行JavaScript！
  13. // @description:ru Выполняйте JavaScript с легкостью!
  14. // @author       Luox
  15. // @version      1.5
  16. // @match        *://*/*
  17. // @grant        none
  18. // @license MIT
  19. // @namespace https://greasyfork.org/users/1365002
  20. // ==/UserScript==
  21.  
  22. (function () {
  23.     'use strict';
  24.  
  25.     const css = `
  26.         #customJsModal {
  27.             position: fixed;
  28.             bottom: 20px;
  29.             right: 20px;
  30.             width: 400px;
  31.             background-color: rgba(0, 0, 0, 0.85);
  32.             color: white;
  33.             padding: 20px;
  34.             border-radius: 10px;
  35.             box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
  36.             font-family: Arial, sans-serif;
  37.             z-index: 9999;
  38.             opacity: 0;
  39.             transform: translateY(100px);
  40.             transition: all 0.4s ease;
  41.             pointer-events: none;
  42.         }
  43.         #customJsModal.show {
  44.             opacity: 1;
  45.             transform: translateY(0);
  46.             pointer-events: all;
  47.         }
  48.         #customJsModal textarea {
  49.             width: 100%;
  50.             height: 150px;
  51.             background-color: #333;
  52.             color: #fff;
  53.             border: none;
  54.             padding: 10px;
  55.             border-radius: 5px;
  56.             font-family: monospace;
  57.             resize: none;
  58.             margin-bottom: 10px;
  59.         }
  60.         #customJsModal button {
  61.             background-color: #4CAF50;
  62.             color: white;
  63.             border: none;
  64.             padding: 10px 20px;
  65.             border-radius: 5px;
  66.             cursor: pointer;
  67.             transition: background-color 0.3s ease;
  68.         }
  69.         #customJsModal button:hover {
  70.             background-color: #45a049;
  71.         }
  72.         #customJsModal button.close-btn {
  73.             background-color: #f44336;
  74.             margin-left: 10px;
  75.         }
  76.         #customJsModal button.close-btn:hover {
  77.             background-color: #d32f2f;
  78.         }
  79.         #jsExecutorToggle {
  80.             position: fixed;
  81.             bottom: 20px;
  82.             right: 20px;
  83.             width: 70px;
  84.             height: 70px;
  85.             background-color: #f7df1e;
  86.             border-radius: 50%;
  87.             box-shadow: 0 8px 16px rgba(0, 0, 0, 0.3);
  88.             cursor: pointer;
  89.             display: flex;
  90.             justify-content: center;
  91.             align-items: center;
  92.             z-index: 9998;
  93.             transition: background-color 0.3s ease;
  94.         }
  95.         #jsExecutorToggle img {
  96.             width: 40px;
  97.             height: 40px;
  98.             pointer-events: none;
  99.         }
  100.         #jsExecutorToggle:hover {
  101.             background-color: #ffeb3b;
  102.         }
  103.     `;
  104.  
  105.     const style = document.createElement('style');
  106.     style.textContent = css;
  107.     document.head.appendChild(style);
  108.  
  109.     const modal = document.createElement('div');
  110.     modal.id = 'customJsModal';
  111.     modal.innerHTML = `
  112.         <textarea id="jsCodeArea" placeholder="Enter your JavaScript code here..."></textarea>
  113.         <button id="executeJsBtn">Run</button>
  114.         <button class="close-btn">Close</button>
  115.     `;
  116.     document.body.appendChild(modal);
  117.  
  118.     const toggleButton = document.createElement('button');
  119.     toggleButton.id = 'jsExecutorToggle';
  120.     toggleButton.innerHTML = `<img src="https://upload.wikimedia.org/wikipedia/commons/6/6a/JavaScript-logo.png" alt="JS Logo">`;
  121.     document.body.appendChild(toggleButton);
  122.  
  123.     toggleButton.addEventListener('click', () => {
  124.         modal.classList.toggle('show');
  125.     });
  126.  
  127.     document.getElementById('executeJsBtn').addEventListener('click', () => {
  128.         const code = document.getElementById('jsCodeArea').value;
  129.         try {
  130.             new Function(code)();
  131.         } catch (e) {
  132.             console.error('Error: ' + e.message);
  133.         }
  134.     });
  135.  
  136.     document.querySelector('#customJsModal .close-btn').addEventListener('click', () => {
  137.         modal.classList.remove('show');
  138.     });
  139.  
  140.     let isDragging = false;
  141.     let offsetX, offsetY;
  142.  
  143.     toggleButton.addEventListener('mousedown', (e) => {
  144.         isDragging = true;
  145.         offsetX = e.clientX - toggleButton.getBoundingClientRect().left;
  146.         offsetY = e.clientY - toggleButton.getBoundingClientRect().top;
  147.         toggleButton.style.transition = 'none';
  148.     });
  149.  
  150.     document.addEventListener('mousemove', (e) => {
  151.         if (isDragging) {
  152.             toggleButton.style.left = `${e.clientX - offsetX}px`;
  153.             toggleButton.style.top = `${e.clientY - offsetY}px`;
  154.         }
  155.     });
  156.  
  157.     document.addEventListener('mouseup', () => {
  158.         isDragging = false;
  159.         toggleButton.style.transition = 'all 0.4s ease';
  160.     });
  161.  
  162. })();