optimize

.gitignore

@@ -1 +1,2 @@
 .DS_Store
+Thumbs.db

manifest.json

@@ -3,7 +3,7 @@
   "name": "Data Extracter",
   "version": "0.0.1",
   "author": "jebbs",
-  "description": "Extract data as sheet from web page elements。",
+  "description": "Extract data from web page elements as sheet.",
   "icons": {
     "16": "icon.png",
     "48": "icon.png",

popup/tip.html

@@ -13,9 +13,13 @@
     <div class="container-fluid" style="min-width: 420px;">
         <div class="row">
             <div class="col">
-                <h3>Data Extractor</h3>
-                <div class="alert alert-info small" role="alert">
-                    <h6>Usage:</h6>
+                <h6>Usage</h6>
+            </div>
+        </div>
+        <div class="row">
+            <div class="col">
+                <div class="alert alert-info small">
+                    <!-- <h6>Usage:</h6> -->
                     <p>
                         <b>Open console</b> and
                         <b>switch to Data Extracter</b>, then call the
@@ -24,20 +28,35 @@
                     <p>
                         <img src="demo.png" alt="" style="max-width: 489px; width: 100%; border-radius: 5px">
                     </p>
+
+                </div>
+            </div>
+        </div>
+        <div class="row">
+
+            <div class="col">
+                <h6>Examples</h6>
+            </div>
+        </div>
+        <div class="row">
+            <div class="col">
+                <div class="alert alert-success small">
                     <p>
-                        <b>Example</b>:<br> extract("table tr", ["td:nth-child(0)","td:nth-child(1)"])
+                        <b>Extract current page</b>:
+                        <br>extract("table tr", ["td:nth-child(0)","td:nth-child(1)"])
                     </p>
+                    <p>
+                        <b>Extract pages of sample.com (1-10, interval 1)</b>:
+                        <br>extract("table tr", ["td:nth-child(0)","td:nth-child(1)"],"http://sample.com/?pn=${page}",1,10,1)
+
+                    </p>
+                    <p>
+                        <b>Extract specified pages (1,3,5)</b>:
+                        <br>extract("table tr", ["td:nth-child(0)","td:nth-child(1)"],"http://sample.com/?pn=${page}",[1,3,5])
+
+                    </p>
+
                 </div>
-                <div class="alert alert-info small" role="alert">
-                    <h6>Interface:</h6>
-                    <p>function extract(itemsSelector:string, fieldSelectors:string[]) </p>
-                    <p>function extract(itemsSelector:string, fieldSelectors:string[], url:string, from:number, to:number, interval:number)</p>
-                    <p>function extract(itemsSelector:string, fieldSelectors:string[], url:string, pages:number[])</p>
-                </div>
-                <!-- <div class="alert alert-danger small" role="alert">
-                    Selector means
-                    <b>JQuery Selectors</b> which is used to select data items and fields.
-                </div> -->
             </div>
         </div>
     </div>