摘要:關(guān)于頁面,你可以查看這里獲取幫助這里是我們的主要這里會主要負(fù)責(zé)我們的主要邏輯,包括實現(xiàn),的解析,小偷程序的實現(xiàn)。
閱讀我的博客文章:chrome插件one-read開發(fā):細(xì)節(jié)
前言點擊這里你可以看到one-read "一覽" chrome版的使用
代碼在這里:github code for one-read
coding地址:coding.net for one-read
manifest文件這里有詳細(xì)關(guān)于manifest的介紹文檔,點擊訪問
json { // 必須的字段 "name": "one-read", "version": "0.1", "manifest_version": 2, // 建議提供的字段 "description": "內(nèi)容聚合", "icons": { "16": "icons/icon16.png", "48": "icons/icon48.png", "128": "icons/icon128.png" }, "browser_action": { "default_icon": "icons/StatusIcon.png", // optional "default_title": "一覽", // optional; shown in tooltip "default_popup": "popup.html", // optional "scripts": ["js/jquery.min.js","js/bootstrap.min.js","js/pop/popup.js"] }, "permissions": [ "http://*/", "http://jandan.net/feed", "http://xueqiu.com/hots/topic/rss", "http://mindstore.io/", "http://segmentfault.com/blogs", "http://www.zhihu.com/explore", "http://solidot.org.feedsportal.com/c/33236/f/556826/index.rss", "http://www.jianshu.com/", "http://next.36kr.com/posts" ] }
著重介紹下permissions的屬性,如果你不聲明的話,你將無法獲取到你想要獲取的內(nèi)容
popup頁面popup作為我們唯一加入的頁面。這里是我們主要的面向用戶的頁面,這個頁面會被渲染,同時展示在用戶面前,因為有“一覽”的界面,所以我只做了一點點的改動。關(guān)于pop頁面,你可以查看這里獲取幫助
這里是我們的主要pop.js,這里會主要負(fù)責(zé)我們的主要邏輯,包括ajax實現(xiàn),xml的解析,小偷程序的實現(xiàn)。
ajax的實現(xiàn)我做了少量的改動
javascript // common function //ajax發(fā)送執(zhí)行的公共函數(shù) function commonAjaxFn(ajaxType, ajaxUrl, ajaxDataType, successFn){ $.ajax({ type: ajaxType, url: ajaxUrl, dataType: ajaxDataType, beforeSend: ajaxBeforeFn, success: function(data){successFn(data)}, error: ajaxErrorFn, complete: ajaxCompleteFn }); } function ajaxFn(data){ } //ajax執(zhí)行前的公共函數(shù) function ajaxBeforeFn(){ $(".pop-div").show(); $(".net-ok").hide(); $(".spinner").show(); } //ajax執(zhí)行完成后的公共函數(shù) function ajaxCompleteFn(){ $(".spinner").hide(); $(".net-ok").show(); $(".pop-div").hide(); } //ajax執(zhí)行后錯誤的公共函數(shù) function ajaxErrorFn(){ }
xml解析:以煎蛋為例子
點擊按鈕后的代碼
javascript //jianshu $("#jianshu-btn").on("click",function(){ $("#nowDot").css({"left":"166px"}); $("#jianshu-page").html(""); commonAjaxFn("GET","http://www.jianshu.com/","html",jianshuFn); return false; }); {% endhighlight %} 或許執(zhí)行的代碼,解析xml {% highlight javascript %} //煎蛋函數(shù) function jandanFn(data){ var ulHtml=""; $(data).find("channel").find("item").each(function(index, ele) { if (index > 9) { return false}; var title = $(ele).find("title").text(); var link = $(ele).find("link").text(); var des = $(ele).find("description").text(); var commentNum = $(ele).find("slashComments").text(); var liHtml = ""; ulHtml += liHtml; }); $(".cat-list ul").hide(); $("#jandan-page").html(ulHtml).show(); } "+title +"
" +""+commentNum+" 條評論 | "+des+"
“小偷程序”的實現(xiàn)(針對沒有xml)
javascript //mindstoreFn function mindstoreFn(data){ var ulHtml=""; $(data).find("#mind-list").find("ul").eq(0).find("li").each(function(index, ele) { if (index > 9) { return false}; var title = $(ele).find(".mind-title>a").text(); var link = $(ele).find(".mind-title>a").attr("href"); var itemString = $(ele).html(); var zanNum = $(ele).find(".vote-total").text(); var mindDes = $(ele).find(".mind-des").text(); var liHtml = "整體"; ulHtml += liHtml; }); $(".cat-list ul").hide(); $("#mindstore-page").html(ulHtml).show(); } "+title +"
" +""+zanNum+" 條支持 | "+mindDes+"
bootstrap作為前端框架
jquery作為js框架
360擴(kuò)展文檔作為支持文檔
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://www.ezyhdfw.cn/yun/49532.html
摘要:加載代碼具體實現(xiàn)更好的方式了解了上面兩種方式以后,我們不難發(fā)現(xiàn),如果能夠采用兩者的結(jié)合會是一個不錯的方式。其實解決方案就是緩存。我們主要采用方案,但是同樣制作標(biāo)記,每次打開時執(zhí)行緩存的文件執(zhí)行緩存中的校驗檢查是否變動,如果變動,更新緩存 閱讀我的博客文章:chrome插件one-read開發(fā):提升 前言 點擊這里你可以看到one-read 一覽 chrome版的使用 代碼在這里:...
摘要:閱讀我的博客文章插件開發(fā)準(zhǔn)備前言為啥要做這個,因為我原本想用做一個書簽管理的東西,但是很久沒有碰過的插件開發(fā)了。點擊這里獲取相關(guān)代碼地址開始開始之前,說說這次做的東西是什么。 閱讀我的博客文章:chrome插件one-read開發(fā):準(zhǔn)備 前言 為啥要做這個,因為我原本想用chrome做一個書簽管理的東西,但是很久沒有碰過chrome的插件開發(fā)了。所以先做一個簡單的,來熟悉下...
摘要:最近基于開發(fā)了一款圖床插件,現(xiàn)在已經(jīng)開源并上架應(yīng)用商店。通過方法把轉(zhuǎn)成,然后放在里測試一下看來效果是的,接下來就是對圖床插件進(jìn)行開發(fā)的步驟了。至此,整個插件的開發(fā)發(fā)布流程就已經(jīng)完成了。 showImg(https://user-images.githubusercontent.com/12172868/57382983-8f29b900-71e0-11e9-8fe9-c0f12fd54...
摘要:首先打開安卓手機(jī)的調(diào)試模式,然后用數(shù)據(jù)線連接到電腦上。打開開發(fā)者工具,這里我就能看到我正在運行應(yīng)用的三星手機(jī),,狀態(tài)處于已連接狀態(tài)。 我之前寫過三篇Cordova相關(guān)的技術(shù)文章。當(dāng)我們使用Cordova將自己開發(fā)的前端應(yīng)用打包安裝到手機(jī)上后,可能會遇到需要調(diào)試Cordova應(yīng)用的時候。 本文就介紹Cordova應(yīng)用的調(diào)試步驟。 如果大家讀過之前我寫的文章,就知道Cordova應(yīng)用在移動...
閱讀 1809·2023-04-25 16:28
閱讀 757·2021-11-23 09:51
閱讀 1532·2019-08-30 15:54
閱讀 1223·2019-08-30 15:53
閱讀 2898·2019-08-30 15:53
閱讀 3483·2019-08-30 15:43
閱讀 3328·2019-08-30 11:18
閱讀 3390·2019-08-26 10:25