Có phương pháp Greasemonkey để nối thêm nội dung HTML cơ bản vào cuối trang ngay sau thẻ <body> hay ngay trước khi thẻ kết thúc?Phương pháp cơ bản để thêm nội dung html vào trang bằng Greasemonkey?
tôi thấy trước/sau phương pháp nhưng tôi cần phải biết tên của các yếu tố có thể thay đổi trang này sang trang ..
Cách nhanh chóng và dơ bẩn: chỉ Vui lòng sử dụng innerHTML cho thương hiệu- mới nội dung.
var newHTML = document.createElement ('div');
newHTML.innerHTML = ' \
<div id="gmSomeID"> \
<p>Some paragraph</p> \
etc. \
</div> \
';
document.body.appendChild (newHTML);
Một kịch bản hoàn chỉnh thấy jQuery cách nào tốt hơn (và với mới, ECMAScript 6, chuỗi multiline):
// ==UserScript==
// @name YOUR_SCRIPT_NAME
// @include http://YOUR_SERVER.COM/YOUR_PATH/*
// @require http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js
// @grant GM_addStyle
// ==/UserScript==
//--- The @grant directive is used to restore the proper sandbox.
$("body").append (`
<div id="gmSomeID">
<p>Some paragraph</p>
etc.
</div>
`);
Cả phương pháp sẽ đặt nội dung mới như thế này:
<!-- NEW STUFF INSERTED HERE -->
</body>
Đó là một nơi tốt cho nó.
Mặc dù HTML đang ở cuối của trang, bạn có thể sử dụng CSS để hiển thị nó bất cứ nơi nào với một cái gì đó như:
GM_addStyle (" \
#gmSomeID { \
position: fixed; \
top: 0px; \
left: 0px; \
} \
");
oh chờ đợi, mà hoạt động bằng cách thêm một phần tử mới vào cuối phần thân. Có vẻ tốt đẹp mặc dù đặt tên hơi gây hiểu lầm. '=]' –
@ FabrícioMatté: Vâng, tiêu đề câu hỏi và văn bản có chút mâu thuẫn. Đã chỉnh sửa để xóa. Việc thêm nội dung mới vào '
' là vị trí mặc định tốt nhất. –Vâng, khi tôi đọc lướt qua câu trả lời này, tôi đã không nhận ra 'newHTML' thực sự là một phần tử đóng vai trò là vùng chứa cho html mới thay vì một chuỗi html thuần túy, tôi nhận thấy rằng ngay sau đó. Câu trả lời của bạn khá rõ ràng +1: P' –
Nếu bạn không muốn phải muck xung quanh với việc phải thoát khỏi html đa dòng của bạn - bạn có thể đặt HTML của mình vào các tệp cục bộ và tải nó bằng cách sử dụng GM_getResourceText. Hãy chắc chắn rằng bạn có enabled your Greasemonkey/Tampermonkey to use local files.
ví dụ:
// ==UserScript==
// @name Tamper Test
// @namespace http://tampermonkey.net/
// @version 0.1
// @description try to take over the world!
// @author You
// @match file:///C:/david/sandbox/tampermonkey/tamper.html
// @require http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js
// @resource html file:///C:/david/sandbox/tampermonkey/foo.html
// @resource style file:///C:/david/sandbox/tampermonkey/style.css
// @grant GM_addStyle
// @grant GM_getResourceText
// ==/UserScript==
(function() {
'use strict';
$("body").append('<div id = "dwj-tamper">new content from tamper script</div>');
GM_addStyle(GM_getResourceText("style"));
$("body").append(GM_getResourceText("html"));
})();
Giải pháp này là tốt nếu tamperscript là cho chính mình mà thôi. Bạn có thể lưu tài nguyên trực tuyến tương tự. Ví dụ:
// @resource pastebin http://pastebin.com/raw/9WfbN24i
//...
$("body").append(GM_getResourceText("pastebin"));
cũng làm việc
@BrockAdams Cảm ơn bạn đã chỉ ra điều đó. Sẽ sửa đổi điều này ngay bây giờ. – dwjohnston
Có vẻ tốt . –
sử dụng 'document.body.insertBefore (newElement, document.body.firstChild) 'để đặt một cái gì đó vào đầu –