Shulou(Shulou.com)05/31 Report--

This article mainly explains "how to write JavaScript code to realize comment like function". The explanation content in this article is simple and clear, easy to learn and understand. Please follow the idea of Xiaobian and go deep into it slowly to study and learn "how to write JavaScript code to realize comment like function" together.

Effect drawing:

1) Delete shared content

Use event proxy to click close button to delete shared content.

Delete Events:

By using event agent function, events are added to parent element node to reduce code amount and system running load.

When an event proxy is used, the srcElement attribute in the event object is used to obtain the trigger element.

Internet Explorer supports window.event.srcElement, while Firefox supports window.event.target.

So, to be compatible in Firefox, you only need to change one code: var el = e.srcElement to var el = e.srcElement||e.target

removeChild() refers to deleting the child element, so to delete the current element el, first use parentNode to find the parent node, and then use removeChild(el) to delete the el element.

var list = document.getElementById('list'); var boxs = document.getElementsByClassName('box'); //delete node function function removeNode(node){ node[xss_clean].removeChild(node); } //Event Agent for(var i=0 ;i10 ? m: '0' + m; d = d>10 ? d: '0' + d; h = h>10 ? h: '0' + h; mi = mi>10 ? mi: '0' +mi; return y + '-' + m + '-' + d + ' ' + h + ':' + mi; } }

5) Realize the function of like reply

There is a my attribute in the a label of the like button, indicating whether you have liked it. When the my value is 0, the total will increase by one when clicking the like button. When the my value is 1, the total will decrease by 1 when clicking the like button.

JS Code:

//like reply function praiseReplay(el){ var oldTotal = parseInt(el.getAttribute('total')); var my = parseInt(el.getAttribute('my')); var newTotal = 0; if(my == 0){ newTotal = oldTotal + 1; el.setAttribute('total',newTotal); el.setAttribute('my',1); el[xss_clean] = newTotal + 'unlike'; }else{ newTotal = oldTotal - 1; el.setAttribute('total',newTotal); el.setAttribute('my',0); el[xss_clean] = (newTotal == 0) ? ' : newTotal + ' like'; } el.style.display = (newTotal == 0) ? '' : 'inline-block'; }

6) Delete and reply to the contents in the reply list

Reply to others 'comments and delete your comments

JS Code:

//operation reply function operateReply(el){ var commentBox = el[xss_clean][xss_clean];//comment container var box = commentBox[xss_clean][xss_clean];//The container shared by this item var textarea = box.getElementsByTagName('textarea')[0]; var user = commentBox.getElementsByClassName('user')[0]; var txt = el[xss_clean]; if(txt =='reply '){ textarea.onfocus(); textarea.value = 'Reply' + user[xss_clean]; textarea.onkeyup(); } else{ removeNode(el[xss_clean][xss_clean][xss_clean]); } } Thank you for your reading. The above is the content of "How to write the code for JavaScript to realize the comment like function". After studying this article, I believe everyone has a deeper understanding of how to write the code for JavaScript to realize the comment like function. The specific use situation still needs to be verified by practice. Here is, Xiaobian will push more articles related to knowledge points for everyone, welcome to pay attention!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.