通用评论

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758
  1. var RENDER_ELEMENT_WRAPPER = 'RENDER_ELEMENT_WRAPPER'; // 渲染评论的父标签
  2. var RENDER_ELEMENT_COMMENT = 'comment'; // 渲染评论的标签的 id
  3. /**
  4. * 根据 id 创建节点
  5. * @param {string} id id
  6. */
  7. function createElement(id) {
  8. var node = document.createElement('div');
  9. node.setAttribute("id", id);
  10. document.getElementById(RENDER_ELEMENT_WRAPPER).appendChild(node);
  11. }
  12. /**
  13. * 根据 id 删除子节点
  14. * @param {string} id id
  15. */
  16. function removeChild(id) {
  17. var myNode = document.getElementById(id);
  18. while (myNode.firstChild) {
  19. myNode.removeChild(myNode.firstChild);
  20. }
  21. }
  22. function main() {
  23. document.getElementById('render').addEventListener('click', function() {
  24. // 首先清空父标签的内容
  25. removeChild(RENDER_ELEMENT_WRAPPER);
  26. var id = RENDER_ELEMENT_COMMENT;
  27. // 动态创建渲染评论的标签
  28. createElement(id);
  29. // 渲染评论
  30. window.renderComment({
  31. id: id,
  32. type: 1,
  33. businessId: 'test'
  34. })
  35. })
  36. document.getElementById('re-render').addEventListener('click', function() {
  37. removeChild(RENDER_ELEMENT_WRAPPER)
  38. var id = RENDER_ELEMENT_COMMENT;
  39. createElement(id)
  40. window.renderComment({
  41. id: id,
  42. type: 1,
  43. businessId: 'test1'
  44. })
  45. })
  46. }
  47. main();