有道云生成html,有道云笔记添加收藏功能实现原理

有道云笔记收藏功能的本质就是在浏览器上执行一段js脚本，用js脚本来实现收藏功能，这和sec-wiki的快速分享到wiki功能类似。通过执行js这种方法而不是采用插件方式的好处是不用考虑浏览器的兼容性，具有通用性(虽然具体每个浏览器的js代码不一样，但可以写出具有通用性的js代码来兼容所有的浏览器)。使用js进行收藏的缺点是对某些网站失效，如github等https网站.

下面是针对有道云笔记的收藏功能的分析：

有道云笔记的“网页剪报”功能介绍在：http://note.youdao.com/web-clipper.html?entry=index&auto=1。

拖到书签栏后，右键点击属性后发现地址栏竟然是一段js.这不得不让自己想起曾经玩qq空间的时候,同样在url上打了一通js完成了空间的小挂饰功能.

javascript:(function(){CLIP_HOST='http://note.youdao.com/yws';try{var%20x=document.createElement('SCRIPT');x.type='text/javascript';x.src=CLIP_HOST+'/YNoteClipper.js?'+(new%20Date().getTime()/100000);x.charset='utf-8';document.getElementsByTagName('head')[0].appendChild(x);}catch(e){alert(e);}})();

根据这个,我们了解到浏览器的地址栏可能是支持javascript的. 若将这段js做为书签的话,这样就更像是一个插件. 最后根据有道的这个插件,改成自己的服务器js地址,就可以实现自己的功能了. 有兴趣的可以试下. ie插件印象中,好像是需要自己在本地写js文件,最后在注册表中,注册下即可. 而有道的这种方式,完全不需要在用户的本地创建文件,并且插件的升级也重点放在服务器端.

(注意%20代表空格.因此,转换为正常的js后如下. 之所以使用%20做url上,可能是由于它本身是需要url地址栏解析才能生效的原因.因此,最后将写好的js事先encode下再放为一行,做为标签项)

你有什么想法,在下面评论里,表达下吧?

javascript:(function(){alert(1);})();

其实,若时间允许的话,我们更应该研究下有道是如何抓取当前网页,并保存排版功能的. 通过debug js后,肯定可以得出相应的结论. 最后一个问题,很想知道有道云笔记的PC端,是通过什么技术写出来的呢? 今天更新版本里支持了拖动菜单的功能:

这种技术pc client是如何实现的呢?

转自：http://www.350351.com/bianchengyuyan/javascript/254954.html

有道云生成html,有道云笔记添加收藏功能实现原理相关推荐

有道云生成html,有道云笔记实用技巧一键保留网页剪报
一键保留页面内容有道云笔记是一款专业的笔记应用,打造无纸化时代最易用的编辑器与云同步数据备份:多终端自动同步,无需拷贝粘贴:可创意随手记录,通过云端存储,避免丢失:分类整理纷繁笔记:免费1G存储空间 ...
有道云笔记本 html,有道云笔记网页剪报功能使用方法介绍
有道云笔记这款网易开发的笔记应用相信选择的人还是很多的,作为一款同步记录编辑软件,它还有一个很多人喜欢的功能---网页剪报,在浏览网页时遇到有用的页面,点击一下就能保存到笔记中. 今天就来介绍一下有道 ...
有道云导入html,有道云笔记网页剪报怎么用有道云笔记网页剪报使用教程
有道云笔记做为一款同步记录编辑软件,有道云笔记的存储功能相信大家都知道,有道云笔记有一款网页剪报功能不知道大家是否使用过,下面小编就为大家介绍一下有道云笔记网页剪报功能 1.我们需要一个网易账号登陆, ...
PHP可道云开源,Kodexplorer可道云 php版 v4.40
用户只需通过简单环境搭建,即可使用KodExplorer快速完成私有云/私有网盘/在线文档管理系统的部署和搭建.可道云提供了类windows经典用户界面,延续了windows平台的用户界面.操作逻辑和 ...
python操作有道云_Python3调用有道云AI，进行文字识别
#coding=utf-8 import os import json import time import random import base64 import string import has ...
linux 可道云_Aria2+KodExplorer可道云实现离线下载
Aria2安装命令如下: #RPM安装(推荐,环境:CentOS6.X) wget http://mirror.bjtu.edu.cn/repoforge/redhat/el6/en/x86_64/r ...
【轻NAS】Windows搭建可道云私有云盘，并内网穿透公网访问
文章目录 1.前言 2. Kodcloud网站搭建 2.1. Kodcloud下载和安装 2.2 Kodcloud网页测试 3. cpolar内网穿透的安装和注册 4. 本地网页发布 4.1 Cpol ...
阿里云服务器部署可道云
最近在阿里云活动中领取了一台服务器,想要在服务器上部署可道云做私有云,在博客上看到此篇文章,亲测centos7上完美运行,转载一下以供以后学习. 前言:在做一些项目的时候,经常有一些文档交流,修改之后 ...
可道云+Apache+windows开启WebDAV 过程
默认情况下,nginx和apache是不支持path_info的,我们需要做些配置让它支持. 首先需要启用cgi.fix_pathinfo--修改php配置文件php.ini,将;cgi.fix_pa ...

有道云生成html,有道云笔记添加收藏功能实现原理

有道云生成html,有道云笔记添加收藏功能实现原理相关推荐

最新文章

热门文章