摘要:关于页面,你可以查看这里获取帮助这里是我们的主要这里会主要负责我们的主要逻辑,包括实现,的解析,小偷程序的实现。
阅读我的博客文章:chrome插件one-read开发:细节
前言点击这里你可以看到one-read "一览" chrome版的使用
代码在这里:github code for one-read
coding地址:coding.net for one-read
manifest文件这里有详细关于manifest的介绍文档,点击访问
json {
// 必须的字段
"name": "one-read",
"version": "0.1",
"manifest_version": 2,
// 建议提供的字段
"description": "内容聚合",
"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的属性,如果你不声明的话,你将无法获取到你想要获取的内容
popup页面popup作为我们唯一加入的页面。这里是我们主要的面向用户的页面,这个页面会被渲染,同时展示在用户面前,因为有“一览”的界面,所以我只做了一点点的改动。关于pop页面,你可以查看这里获取帮助
这里是我们的主要pop.js,这里会主要负责我们的主要逻辑,包括ajax实现,xml的解析,小偷程序的实现。
ajax的实现我做了少量的改动
javascript // common function
//ajax发送执行的公共函数
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执行前的公共函数
function ajaxBeforeFn(){
$(".pop-div").show();
$(".net-ok").hide();
$(".spinner").show();
}
//ajax执行完成后的公共函数
function ajaxCompleteFn(){
$(".spinner").hide();
$(".net-ok").show();
$(".pop-div").hide();
}
//ajax执行后错误的公共函数
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 %}
或许执行的代码,解析xml
{% highlight javascript %}
//煎蛋函数
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 = ""+title
+"
"
+""+commentNum+" 条评论 | "+des+"
";
ulHtml += liHtml;
});
$(".cat-list ul").hide();
$("#jandan-page").html(ulHtml).show();
}
“小偷程序”的实现(针对没有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 = ""+title
+"
"
+""+zanNum+" 条支持 | "+mindDes+"
";
ulHtml += liHtml;
});
$(".cat-list ul").hide();
$("#mindstore-page").html(ulHtml).show();
}
整体
bootstrap作为前端框架
jquery作为js框架
360扩展文档作为支持文档
文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。
转载请注明本文地址:https://www.ucloud.cn/yun/49532.html
摘要:加载代码具体实现更好的方式了解了上面两种方式以后,我们不难发现,如果能够采用两者的结合会是一个不错的方式。其实解决方案就是缓存。我们主要采用方案,但是同样制作标记,每次打开时执行缓存的文件执行缓存中的校验检查是否变动,如果变动,更新缓存 阅读我的博客文章:chrome插件one-read开发:提升 前言 点击这里你可以看到one-read 一览 chrome版的使用 代码在这里:...
摘要:阅读我的博客文章插件开发准备前言为啥要做这个,因为我原本想用做一个书签管理的东西,但是很久没有碰过的插件开发了。点击这里获取相关代码地址开始开始之前,说说这次做的东西是什么。 阅读我的博客文章:chrome插件one-read开发:准备 前言 为啥要做这个,因为我原本想用chrome做一个书签管理的东西,但是很久没有碰过chrome的插件开发了。所以先做一个简单的,来熟悉下...
摘要:最近基于开发了一款图床插件,现在已经开源并上架应用商店。通过方法把转成,然后放在里测试一下看来效果是的,接下来就是对图床插件进行开发的步骤了。至此,整个插件的开发发布流程就已经完成了。 showImg(https://user-images.githubusercontent.com/12172868/57382983-8f29b900-71e0-11e9-8fe9-c0f12fd54...
摘要:首先打开安卓手机的调试模式,然后用数据线连接到电脑上。打开开发者工具,这里我就能看到我正在运行应用的三星手机,,状态处于已连接状态。 我之前写过三篇Cordova相关的技术文章。当我们使用Cordova将自己开发的前端应用打包安装到手机上后,可能会遇到需要调试Cordova应用的时候。 本文就介绍Cordova应用的调试步骤。 如果大家读过之前我写的文章,就知道Cordova应用在移动...
阅读 2062·2023-04-25 16:28
阅读 976·2021-11-23 09:51
阅读 1798·2019-08-30 15:54
阅读 1385·2019-08-30 15:53
阅读 3076·2019-08-30 15:53
阅读 3701·2019-08-30 15:43
阅读 3493·2019-08-30 11:18
阅读 3737·2019-08-26 10:25