添加jQuery UI到Greasemonkey脚本失败，并带有外部CSS文件 [英] Adding jQuery UI to Greasemonkey script fails with external CSS file

问题描述

我试图添加jquery-ui到Greasemonkey脚本。我的完整代码： test.user.js ：

  // = = UserScript == 
 // @name Test 
 // @namespace rajat.khandelwal 
 // @description测试脚本
 // @include * 
 // @ require js / jquery-1.6.2.min.js 
 // @require js / jquery-ui-1.8.16.custom.min.js 
 // @require css / ui-darkness / jquery -ui-1.8.16.custom.css 
 
 // == / UserScript == 
 alert（'hi'）; 
  

和在当前目录中我添加了JS和CSS目录。它会抛出错误说语法错误在css

 错误：语法错误
源文件：file：/// C：/Users/Rajat/AppData/Roaming/Mozilla/Firefox/Profiles/poxivdqy.default/gm_scripts/test/jquery-ui-1816custom.css 
行：13 
  

第13行是：

  .ui-helper-hidden {display：none; } 
  

有什么问题？如何添加jquery-ui并在我的用户脚本中使用它？

解决方案

// @require 目前只能用于JavaScript文件。这个错误是由于试图解析CSS为JS。
$ b

对于CSS文件使用 // @resource ，就像这样：

  // == UserScript == 
 // @name测试
 // @namespace rajat .khandelwal 
 // @description测试脚本
 // @include http://YOUR_SERVER.COM/YOUR_PATH/* 
 // @require js / jquery-1.6.2.min.js 
 // @require js / jquery-ui-1.8.16.custom.min.js 
 // @resource customCSS css / ui-darkness / jquery-ui-1.8.16.custom.css 
 // @grant GM_addStyle 
 // @grant GM_getResourceText 
 // == / UserScript == 
 
 var newCSS = GM_getResourceText（customCSS）; 
 GM_addStyle（newCSS）; 
 
 alert（'hi'）; 
  

---

但是，jQuery-UI CSS大量使用背景图像。为了得到jQuery-UI CSS的最大效果，我不再建议通过 GM_addStyle（）添加它， 。

使用注入< link> 这个完整的，jQuery-UI示例脚本。

I'm trying to add jquery-ui to a Greasemonkey script. my full code: test.user.js:

// ==UserScript==
// @name           Test
// @namespace      rajat.khandelwal
// @description    Test script
// @include        *
// @require        js/jquery-1.6.2.min.js
// @require        js/jquery-ui-1.8.16.custom.min.js
// @require        css/ui-darkness/jquery-ui-1.8.16.custom.css

// ==/UserScript==
alert('hi');

and In current directory I added JS and CSS directory. It throws error saying syntax error in css

Error: syntax error
Source File: file:///C:/Users/Rajat/AppData/Roaming/Mozilla/Firefox/Profiles/poxivdqy.default/gm_scripts/test/jquery-ui-1816custom.css
Line: 13

Line 13 is:

.ui-helper-hidden { display: none; }

What is the problem? How can I add jquery-ui and use it in my userscript?

解决方案

// @require currently only works with javascript files. That error is from trying to parse CSS as JS.

Use // @resource for CSS files, like so:

// ==UserScript==
// @name        Test
// @namespace   rajat.khandelwal
// @description Test script
// @include     http://YOUR_SERVER.COM/YOUR_PATH/*
// @require     js/jquery-1.6.2.min.js
// @require     js/jquery-ui-1.8.16.custom.min.js
// @resource    customCSS css/ui-darkness/jquery-ui-1.8.16.custom.css
// @grant       GM_addStyle
// @grant       GM_getResourceText
// ==/UserScript==

var newCSS = GM_getResourceText ("customCSS");
GM_addStyle (newCSS);

alert('hi');

---

However, jQuery-UI CSS makes heavy use of background images. Images that are included via relative paths.

To get the maximum effect of jQuery-UI CSS, I no longer recommend adding it via GM_addStyle().

Use an injected <link> as shown in this complete, jQuery-UI example userscript.

这篇关于添加jQuery UI到Greasemonkey脚本失败，并带有外部CSS文件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！