有没有办法在纯javascript中创建文本水印？

我想创建和添加文本水印的网页。它应该用纯javascript创建

编辑：

---

<强> >以当前页面为例，希望在页面中间显示半透明文本“StaskObjor”。

< P>用纯JS制作水印是很长的，但jQuery：

更容易。

$(document).ready(function(){
  var Html = "<div id='myDiv'>My Watermark</div>";
  $("body").append(Html);

  $("#myDiv").css({
    "color":"#bbb","font-size":"100px",
    "position":"absolute","top":"0px","left":"0px",
    "z-index":"-1","transform":"rotate(45deg)"
  });
});

---

请参阅jsfiddle:

这就是您需要的吗？？？对你尝试了什么，你被困在哪里了？帮助我们，帮助你。但是，我相信可以用纯javascript创建并向网页添加文本水印。您必须定义水印的含义。在今天的web上，通过

占位符
属性可以更好地完成@C-linkNepal发布的链接。@ElliottFrisch我还没有尝试过任何东西。只是想弄清楚我要问的第一个问题：为什么是纯javascript？为什么不做一些CSS呢？例如，使用一些javascript在页面上插入一个元素，使用一个类或id，并使用CSS进行适当的样式设置。使用HTML和CSS不难做到这一点——你没有做任何特别的事情。这很完美，但我的要求是纯javascript。我认为Jquery在这里没有做任何特别的事情。这是CSS。我将尝试在纯javascript中使用此CSS。Bubba，我添加了纯JS解决方案，将其标记为answer，tks
var div = document.createElement("div");
document.getElementsByTagName("body")[0].appendChild(div);

div.innerHTML = "My Watermark";
div.style.color = "#bbb";
div.style.fontSize = "100px";
div.style.position = "absolute";
div.style.top = "0px";
div.style.left = "0px";
div.style.zIndex = "-1";

div.style.transform = "rotate(45deg)"; //standard
div.style.msTransform = "rotate(45deg)"; //IE
div.style.mozTransform = "rotate(45deg)"; //Firefox
div.style.webkitTransform = "rotate(45deg)"; //Chrome
div.style.oTransform = "rotate(45deg)"; //Opera