简体   繁体   中英

Iframes and Deprecated methods in javascript

I am building a classic post related cms on LAMP stack, as a project to show at future interviews and land a job potentially. I want to build a rich text editor. After some research both in r/javascript and stack overflow I drew some conclusions.

  1. Don't use "contentEditable=true" flag because according to one of CKEditor's devs https://stackoverflow.com/a/11479435/10245890 is not optimal
  2. The general consensus is to use iframe because of the isolation it provides.
  3. Yes I know I will not build the next CKEditor on my own, it takes years of far more experienced people than me, I just want to learn about the Javascript APIs.
  4. Generally I want to use vanilla version of the languages in the stack in order to get a better understanding of them.

The 'easy' way out to get a simple rich text editor going is to use execCommand but it is obselete. What I came up with goes like this:

function formatBold(){
  var selection = document.getSelection().toString();
  var originalString = document.getElementById("post-body-editor").innerHTML;
  document.getElementById("post-body-editor").focus();
  document.getElementById("post-body-editor").innerHTML = originalString.replace(selection, '<b>'+ selection +'</b>');
  return;
}
document.addEventListener('keydown', function(event) {
  if(event.ctrlKey && event.key === 'b'){
    formatBold();
    return;
  }
  return;
});

The function is called with a HTML button or key press. I saw in MDN that there is a method to implement insert Link, format a text with bold etc. Question is. I see some, if not many,methods flagged as deprecated but they seem to be working. Should I use them or make it work on my own as shown above? I realize its not the most elegant solution but I believe it works fine for my level. Also any articles or other reading material is appreciated ofc.

EDIT:Formatting

If the question is just about using deprecated/obsolete features, the answer is: don't use. Though, I doubt execCommand would never really be removed from the browsers, that would break tons of existing pages... If you really want to create a WYSIWYG editor, you've to dive deep in the world of DOM. In that world use of innerHTML is exceptional, you would work with Nodes and ShadowRoot etc.

Answered by Teemu in comment above.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM