Question

我正在尝试使用Greasemonkey将一些Javascript代码注入网页。首先，我将从有效的方法开始。

var script = document.createElement( 'script' );
script.src = "http://code.jquery.com/jquery.min.js";
$("#navHome").append( script );

var buttonCode ='<input type="button" value="Make public" onclick="var selector=\'div.timelineTimestamp\'; $(selector).each(function() { var textToAppend=\' <input type=\\\'button\\\' value=\\\'Make Public\\\' > \'; $(this).append(textToAppend) });">'


$("#navHome").append(buttonCode);

我正在尝试更改buttonCode的行，以便在按下按钮时显示警告。但是要插入一条警告信息，我需要在引号中再降低一级，我找不到让它工作的方法。

我可以通过插入以下

来实现它的关闭

onclick=\\\'alert(\\\\\'hi\\\\\')\\\'

但仍然无效。怎么办呢？

Answer 1

您应该尝试使用jQuery构建元素，如下所示：

$("#navHome").append($("<script />").attr("src", "http://code.jquery.com/jquery.min.js"));

var buttonCallback = function() {
    // your callback code goes here...
};

$("#navHome").append($("<input />").attr("type", "button").val("Make public").bind("click", buttonCallback));

Answer 2

您的脚本中已经有jQuery，其中@require指令，否则$("#navHome").append( script );将无效。

所以，不要将jQuery注入目标页面。将所有内容保存在沙箱中。它运行得更快，并发症更少。丢失所有<script>部分并使用：

$("#navHome").append ('<button id="makePublicBtn">Make public</button>');

$("#makePublicBtn").click ( function () {
    var selector    = 'div.timelineTimestamp';
    $(selector).each (function () {
        var textToAppend    ='<input type="button" value="Make Public">';
        $(this).append (textToAppend);
    } );
} );

注意：使用<button>作为按钮，除非它是表单的一部分，并且您希望传输该值。

Answer 3

var buttonCode ="<input type=\"button\" value=\"Make public\" onclick=\"var selector='div.timelineTimestamp'; $(selector).each(function() { var textToAppend=' <input type=\"button\" value=\"Make Public\" > '; $(this).append(textToAppend) });\">";

注意在var声明的开头和结尾我替换了＆＃39; by＆＃34; ，在声明中我添加了\＆＃34;

Answer 4

var script = document.createElement( 'script' );
script.src = "http://code.jquery.com/jquery.min.js";




$("#navHome").append( script );

var buttonCode ="<input type=\"button\" id=\"btnID\" value=\"Make public\" >"; 


$("#navHome").append(buttonCode);

$('#btnID').live('click',function(){  // get click event on dynamically created element
    $('div.timelineTimestamp').each(function() { 
        var textToAppend= "<input type=\"button\" value=\"Make Public\" > "; 
        $(this).append(textToAppend) ;
        });
});

如何让这些嵌套的引号在Javascript中工作？

4 个答案: