所以我一直在尝试制作一个mod菜单来破解iReady作为书签,我是HTML的初学者,所以我从显示一个按钮开始。它显示在主页上,但在课程中,按钮消失了。当我退出课程时,按钮会重新显示。我的代码:
let c = document.createElement('div');
c.innerHTML = `<button onclick="test()">test</button>`;
document.body.appendChild(c);
是的,我刚做了一个按钮,我想让按钮先出现
也许您需要将代码放在onload函数中,或者放在正文末尾的脚本标记中,以便在页面加载后运行?
头部:
<head>
<script>
window.onload = function () {
let div = document.body.appendChild(document.createElement('div'));
let button = document.createElement('button');
button.setAttribute('onclick', 'test()')
button.innerHTML = 'test';
div.append(button);
}
</script>
</head>
或体内:
<body>
<!-- some other html -->
<script>
let div = document.body.appendChild(document.createElement('div'));
let button = document.createElement('button');
button.setAttribute('onclick', 'test()')
button.innerHTML = 'test';
div.append(button);
</script>
</body>
我发现了一个类似mod菜单的东西,它可以像你试图做的那样制作按钮,它是一个bookmarklet!
在这里:
javascript:(function()%7Bjavascript%3A (function main() %7B%0A %2F* I add random characters at the end of the ID so that it does not clash with any other ID's on the page *%2F%0A%0A const ID %3D%0A '--picture-in-picture-toolbar-8743fsfjkl9274g9832fkjdslfjksl7498247389'%3B %2F* Helper functions *%2F%0A const get %3D (selector%2C el %3D document) %3D> el.querySelector(selector)%3B%0A const getAll %3D (selector%2C el %3D document) %3D>%0A Array.from(el.querySelectorAll(selector))%3B%0A %2F* Remove our toolbar if it exists *%2F let _toolbar %3D get(%60%23%24%7BID%7D%60)%3B%0A if (_toolbar) %7B%0A _toolbar.parent.removeChild(_toolbar)%3B%0A %7D%0A %2F* create the toolbar *%2F const toolbar %3D document.createElement(%0A 'div'%0A )%3B %2F* Set the toolbar's ID%2C so we can remove it later *%2F%0A toolbar.id %3D ID%3B %2F* Use shadow-dom as outlined here%3A https%3A%2F%2Fdevelopers.google.com%2Fweb%2Ffundamentals%2Fweb-components%2Fshadowdom *%2F%0A %2F* Inside shadow dom we don't have to worry about conflicting styles. *%2F const shadowroot %3D toolbar.attachShadow(%0A %7B mode%3A 'open' %7D%0A )%3B%0A shadowroot.innerHTML %3D %60<style>%23container %7B z-index%3A 9999%3B border%3A 1px solid %23000%3B border-radius%3A 3px%3B padding%3A 0.7em%3B position%3A fixed%3B top%3A 0.5em%3B right%3A 0.5em%3B background-color%3A rgba(0%2C0%2C0%2C0.7)%3B font-family%3A -apple-system%2CBlinkMacSystemFont%2C"Segoe UI"%2CRoboto%2C"Helvetica Neue"%2CArial%2C"Noto Sans"%2Csans-serif%2C"Apple Color Emoji"%2C"Segoe UI Emoji"%2C"Segoe UI Symbol"%2C"Noto Color Emoji"%3B%7Dbutton %7B padding%3A 0.5em 0.7em%3B border-radius%3A 3px%3B box-shadow%3A none%3B border%3A 2px solid %23fff%3B background-color%3A transparent%3B color%3A %23fff%3B cursor%3A pointer%3B%7Dbutton%3Ahover %7B background-color%3A white%3B color%3A black%3B%7D<%2Fstyle><div id%3D"container"> <button aria-label%3D"click to alert" id%3D"alert"> Click to Alert <%2Fbutton> %0A <button onclick%3D"myFunction()">Click me<%2Fbutton>%0A <button onclick%3D"myFunction()">Click me<%2Fbutton>%0A <button onclick%3D"myFunction()">Click me<%2Fbutton>%0A %0A <button aria-label%3D"close" id%3D"close"> x <%2Fbutton><%2Fdiv> %60%3B%0A %0A %0A get('%23close'%2C shadowroot).addEventListener('click'%2C () %3D> %7B%0A const toolbar %3D get(%60%23%24%7BID%7D%60)%3B%0A if (toolbar) %7B%0A toolbar.parentNode.removeChild(toolbar)%3B%0A %7D%0A %7D)%3B%0A const alertEl %3D get('%23alert'%2C shadowroot)%3B%0A alertEl.addEventListener('click'%2C e %3D> %7B%0A alert('You clicked to alert')%3B%0A %7D)%3B%0A document.body.appendChild(toolbar)%3B%0A%7D)()%3B%7D)()%3B