0

好的,这就是交易:我正在尝试创建一个用户脚本以在 Greasemonkey/Chrome/人们用来管理这些东西的任何其他东西中使用。我想做的一部分是为我为这个特定脚本设计的图标创建标签。我至少对如何在 Jquery 中完成此任务有一个粗略的了解。我会使用的代码是这样的:

$('li.tab.iconic').each(function (i) {
    var spanName = $('this').attr(id);
    var toRemove = '_button';
    var spanNameCrop = spanName.replace(toRemove,'');
    $('this').append('<span class="tooltip_label">'+spanNameCrop+'</span>');
});

基本上,我想获取ideach 的属性,li从中修剪短语“_button”,然后将剩余的文本插入将成为标签的跨度中。我的问题是我搜索了高低,但没有找到关于如何在 javascript 中执行这样的循环的明确说明。甚至可能吗?

或者,我正在设计的网站确实包含 Jquery 库。有没有办法告诉我的脚本在站点加载 jquery 后加载,以便 jquery 脚本可以工作?

编辑:感谢 Avladov 让它工作。这是最终的脚本。

var jQuery, $ = null;

function addJQuery(callback) {
var p = null;

if(window.opera || window.navigator.vendor.match(/Google/)) {
    var div = document.createElement("div");
    div.setAttribute("onclick", "return window;");
    p = div.onclick();
}
else {
    p = unsafeWindow;
}

jQuery = $ = p.jQuery.noConflict();
callback();
}

var myFunction = function() {
jQuery('#header .tab.iconic[id!="missinge_button"] a').css({"background-image":"url('http://i.imgur.com/2QmZG.png')"});

jQuery('#header .tab.iconic').each(function (i) {
    var tabID = jQuery(this).attr('id');
    var labelName = tabID.replace('_button','');
    if (jQuery(this).find('span[class="tooltip_label"]').length){
    }
    else{
    jQuery(this).append('<span class="tooltip_label">'+labelName+'</span>');
    jQuery('.tooltip_label').css({'text-transform':'capitalize'});
    }
});

};

addJQuery(myFunction);
4

3 回答 3

2

你不想使用'this'你想使用this,如果 id 不是一个带有值的变量字符串,你希望它是一个字符串:

$('li.tab.iconic').each(function (i) {
    var spanName = $(this).attr('id');
    var toRemove = '_button';
    var spanNameCrop = spanName.replace(toRemove,'');
    $('this').append('<span class="tooltip_label">'+spanNameCrop+'</span>');
});

如果该站点不使用 jQuery,您可以为它们包含 jQuery,例如:

if(!(window.jQuery && window.jQuery.fn.jquery == '1.8.1')) {var s = document.createElement('script');s.setAttribute('src', 'http://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js');s.setAttribute('type', 'text/javascript');document.getElementsByTagName('head')[0].appendChild(s);}
于 2012-09-11T15:49:32.900 回答
1

如果您的 Greasemonkey 脚本用于使用 jQuery 的站点,那么您可以在脚本中使用它。使用此代码:

var jQuery, $ = null;

function addJQuery(callback) {
    var p = null;

    if(window.opera || window.navigator.vendor.match(/Google/)) {
        var div = document.createElement("div");
        div.setAttribute("onclick", "return window;");
        p = div.onclick();
    }
    else {
        p = unsafeWindow;
    }

    jQuery = $ = p.jQuery.noConflict();
    callback();
}

回调是Greasemonkey 脚本中的一个函数。完成此操作后,您可以将jQueryjQuery$一起使用,就好像它是一个普通的网页 JavaScript。

这种方法的好处是它不仅适用于 Firefox,也适用于 Chrome 和 Opera。它也不会加载新的 jQuery 脚本,而是重用网页中的那个。

例子:

var myFunction = function() {
    // Your code here
};

addJQuery(myFunction);


编辑:
有一种方法可以通过在脚本元数据块中使用@include@match来限制脚本。
您可以在 GM Wiki 上阅读更多相关信息 - http://wiki.greasespot.net/Metadata_Block

于 2012-09-11T15:56:49.540 回答
0

在 document.ready 函数中添加您的 jquery 脚本

$(document).ready(function(){
$('li.tab.iconic').each(function (i) {
    var spanName = $('this').attr('id');
    var toRemove = '_button';
    var spanNameCrop = name.replace(toRemove,'');
    $(this).append('<span class="tooltip_label">'+spanNameCrop+'</span>');
});
})

当页面上的所有资源都被抓取时,代码现在将执行

你可以在这里阅读更多:http: //api.jquery.com/ready/

于 2012-09-11T15:48:42.790 回答