首頁 > web前端 > js教程 > 純JavaScript程式碼實作文字比較工具_javascript技巧

純JavaScript程式碼實作文字比較工具_javascript技巧

WBOY
發布: 2016-05-16 15:15:16
原創
1651 人瀏覽過

之前專案需求需要寫一個純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_">


登入後複製

以上程式碼是使用的純JavaScript程式碼實作文字比較工具,希望對大家有幫助!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門推薦
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板