Ѕыстрый и гр¤зный способ: используйте только innerHTML
дл¤ совершенно нового контента.
var newHTML = document.createElement ('div');
newHTML.innerHTML = '
<div id="gmSomeID">
<p>Some paragraph</p>
etc.
</div>
';
document.body.appendChild (newHTML);
ѕолный скрипт, показывающий несколько лучший способ jQuery (и с новой, ECMAScript 6, многострочной строкой):
// ==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>
` );
ќба метода будут размещать новый контент следующим образом:
<!-- NEW STUFF INSERTED HERE -->
</body>
Ёто хорошее место дл¤ этого.
Ќесмотр¤ на то, что HTML находитс¤ в конце страницы, вы можете использовать CSS дл¤ отображени¤ в любом месте с чем-то вроде:
GM_addStyle ( "
#gmSomeID {
position: fixed;
top: 0px;
left: 0px;
}
" );