JSFiddle - React, Tailwind, and code Playground
HTML
<body>
<div contenteditable="true">
<p>Lets get started!</p>
</div>
</body>
JavaScript
function getNewLines() {
console.log(document.getSelection());
if (document.getSelection().anchorNode) {
var node = document.getSelection().anchorNode;
var nodeContents = "";
if (node.innerHTML) {
nodeContents = node.innerHTML.toLowerCase();
} else {
nodeContents = node.innerHTML;
}
if (nodeContents !== undefined) {
if (nodeContents === "" || nodeContents == "<br>" || nodeContents ==
"<br/>" || nodeContents.substr(nodeContents.length - 5) == "<br/>" ||
nodeContents.substr(nodeContents.length - 4) == "<br>") {
console.log("you are on a new line :]");
} else {
console.log('nope not a new line');
}
} else {
console.log('nice try, but no not a new line');
}
}
}
// from http://stackoverflow.com/a/20078537/3700836
var getString = (function() {
var DIV = document.createElement("div");
if ('outerHTML' in DIV) return function(node) {
return node.outerHTML;
};
return function(node) {
var div = DIV.cloneNode();
div.appendChild(node.cloneNode(true));
return div.innerHTML;
};
})();
setInterval(getNewLines, 100);