2018年7月25日 星期三

快速清除table表格或div內的所有屬性,以便取得乾淨的html碼

這篇主要是備註,有時從客戶端取得的製作文件 如:表格、設定過格式的ppt或doc文件檔案等等,需要把內容移植成html格式,使用以下的方法可快速得到乾淨的html檔案

以下以ppt檔案內的表格為例,假設ppt檔案內有一個複雜的表格要轉為html碼

1.開啟ppt檔案,轉存為pdf

2.使用acrobat開啟該pdf,然後轉存為html檔案

/* 以上兩個步驟主要是要把ppt檔案的表格轉存為html檔案,使用別的方式也可以 */

3.開啟html檔案,通常會看到html碼內已經被設定了一堆密密麻麻的屬性,此時先大概刪除掉不需要的部分,取得單純的<table></table> 這一段內的html碼

4.在該文件加上html , head, body,.....  等等網頁tag,另外也順便掛上jquery引用路徑

5.在最後加上下面的java script

<script>
 $(function(){     $('*').removeAttr('style');   //移除文件內的所有style 屬性     $('*').removeAttr('class');   //移除文件內的所有class 屬性     $('*').removeAttr('bgcolor');    //移除文件內的所有bgcolor 屬性     $('* p').contents().unwrap();   //把所有用<p>包起來的內容解開(移除<p></p>)   }) </script>

/* 按照上面的邏輯可以自己加上想要移除的tag或屬性 */

6.使用瀏覽器瀏覽該網頁檔案

7.使用chrome的 /檢視/開發人員選項/開發人員工具 檢視,從檢視碼內就可以把去掉tag及屬性的內碼copy出來


powerpoint 2010 把ppt存成網頁

在powerpoint 2010 的功能列選項內沒有「另存成網頁」這個選擇,必須另外處理,步驟如下:

1.開啟ppt檔案,按下alt+F11 開啟VBA,然後按下Ctrl+G (windows) 或 ^⌘G (Mac) 顯示立即視窗(如下圖)



2.在立即視窗內輸入
ActivePresentation.SaveAs "C:/test.htm", ppSaveAsHTML, msoFalse
(mac檔名處若不加上路徑直接輸入 "test.htm" 則檔案會存到「文件」資料夾內)。
然後按下Enter,即可在指定路徑下存成test.htm檔案

2018年7月23日 星期一

用photoshop 壓縮優化png圖檔,減少圖檔大小 避免造成網頁loading過重

做網頁儲存png圖檔時,常常檔案很大會造成網頁loading較重
可使用photohsop內的 影像/調整/色調分離 來降低圖檔內的色階
然後再轉存,進而減少檔案的大小。

2018年7月20日 星期五

jquery 算出隨機整數字

var randomNum = Math.floor(Math.random() * customVal);
//customVal 可以是自訂的參數,譬如以視窗或指定div的高或寬

2018年7月10日 星期二

jquery引用網址

jquery官方提供的網址

<script src='//code.jquery.com/jquery-2.1.4.min.js'></script>


google提供的網址

<script src='//ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js'></script>

注意:
Google CDN網址雖然是比較好的選擇,但為了避免被大陸地區google的服務會有異常,建議使用jquery官方提供的引用網址
後方的數字可更改以符合最新版次,jquery版本資訊可見這裡



2018年7月7日 星期六

Android studio使用emulate Android模擬器時出現device still connecting bug臭蟲的修正方式

狀況:
終端機使用$ cordova emulate android指令時,無法正常開啟並執行Android studio的模擬器

錯誤碼:

(node:1225) UnhandledPromiseRejectionWarning: CordovaError: Failed to execute shell command "getprop,dev.bootcomplete"" on device: Error: adb: Command failed with exit code 1 Error output:
error: device still connecting

修正方式:
Step1.
開啟電腦資料夾至APP專案內下面這個位置的emulator.js檔案
yourAppName/platforms/android/cordova/lib/emulator.js

Step2.
以編碼軟體開啟emulator.js檔案,並且找到下面語法
if ((error && error.message &&
    (error.message.indexOf('not found') > -1)) ||
    (error.message.indexOf('device offline') > -1))

Step3.
把上面這段語法改為如下:(紅色字標註是新增的部分)
if ((error && error.message &&
    (error.message.indexOf('not found') > -1)) ||
    (error.message.indexOf('device offline') > -1) ||
    (error.message.indexOf('device still connecting') > -1))

Step4.
修改完並且儲存後,再次於終端機執行模擬指令
$ cordova emulate android
即可順利開啟模擬器

Reference:
  1. https://stackoverflow.com/questions/50935337/failed-to-execute-shell-command-getprop-dev-bootcomplete-on-device-error-for
  2. https://issues.apache.org/jira/browse/CB-14165
  3. https://github.com/apache/cordova-android/pull/457/files