之前專案需求需要寫一個純js文字比較工具,在此小編把程式碼分享在腳本之家平台供大家參考,演算法有待優化,本文寫的不好還請見諒。
先上效果圖:
程式碼如下圖:
把原始碼儲存為html格式的檔案就可以直接運作了
<!doctype html> <html> <head> <title>文本比较工具</title> <style type="text/css"> *{padding:px;margin:px;} html,body{ overflow-y: hidden; } .edit_div{ border: px solid #CCCCCC; overflow: auto; position: relative; } .edit_div textarea{ resize:none; background: none repeat scroll transparent; border: none; width: %; height:px; overflow-y: scroll; position: absolute; left: px; top: px; z-index: ; font-size: px; white-space: pre-wrap; word-wrap: break-word; word-break:break-all; } .edit_div pre{ overflow-y: scroll; white-space: pre-wrap; word-wrap: break-word; word-break:break-all; width: %; height:px; text-align: left; color: #ffffff; z-index: ; font-size: px; } </style> </head> <body> <table style="width:%"> <tr> <td style="width:%"> <div class="edit_div"> <pre id="edit_pre_">