用ajax实现读博客rss示例代码

代码如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>this is test</title>

<script type="text/javascript">
var xmlHttp;

function createXMLHttpRequest() {
if (window.ActiveXObject) {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
else if (window.XMLHttpRequest) {
xmlHttp = new XMLHttpRequest();
}
}

function readRSS(url) {
createXMLHttpRequest();
xmlHttp.onreadystatechange = handleStateChange;
xmlHttp.open("GET", url, true);
xmlHttp.send(null);

}

function handleStateChange() {
if(xmlHttp.readyState == 4) {
if(xmlHttp.status == 200) {
ResultSet();
}
}
}

function ResultSet() {
var results = xmlHttp.responseXML;
var title = null;
var item = null;
var link=null;
//得到channel
var ccc=results.getElementsByTagName("channel");
var headtitle=ccc[0].getElementsByTagName("title")[0].firstChild.nodeValue;
var headlink=ccc[0].getElementsByTagName("link")[0].firstChild.nodeValue;
var cell = document.createElement("div");
cell.innerHTML="<h1><a href="+headlink+" target=_blank>"+headtitle+"</a></h1>
";
document.getElementById("result").appendChild(cell);
//得到items
var items = results.getElementsByTagName("item");
for(var i = 0; i < items.length; i++) {
item = items[i];
link=item.getElementsByTagName("link")[0].firstChild.nodeValue;
title = item.getElementsByTagName("title")[0].firstChild.nodeValue;
var cell = document.createElement("div");
cell.innerHTML="<a href="+link+" target=_blank>"+title+"</a>
";
document.getElementById("result").appendChild(cell);
}

}
function readrss1()
{
var url=document.getElementById("txturl").value;
if(url=="")
{
alert("请输入RSS地址");
}
else
{
readRSS(url);
}
}

</script>
</head>

<body">
<h1>ajax读rss示例</h1>
<form >

<a href="javascript:readRSS('http://www.blogjava.net/rss.aspx')">blogjava原创区 </a>
<a href="javascript:readRSS('http://beginner.blogjava.net/rss.aspx')">blogjava新手区 </a>
<a href="javascript:readRSS('http://life.blogjava.net/rss.aspx')">blogjava非技术区 </a>
<a href="javascript:readRSS('http://general.blogjava.net/rss.aspx')">综合区 </a>

输入一个RSS地址:<input type="text" value="http://www.blogjava.net/wujun/rss.aspx" size=50 id="txturl">
<input type="button" value="查 看" onclick="readrss1()">

</form>
<div id="result"></div>
</body>
</html>

赞 (0)

相关推荐

  • 用ajax实现读博客rss示例代码

    复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>this is test</title

  • 用实现ajax读博客rss示例代码

    this is test var xmlHttp; function createXMLHttpRequest() { if (window.ActiveXObject) { xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); } else if (window.XMLHttpRequest) { xmlHttp = new XMLHttpRequest(); } } function readRSS(url) { createXMLHt

  • js使用ajax读博客rss示例

    复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>this is test</tit

  • Nuxt.js实现一个SSR的前端博客的示例代码

    为什么要用Nuxt.js 公司现有的项目只有落地页是通过前端本身server读取pug文件进行服务端渲染的,当然是为了首屏加载速度以及SEO.Nuxt.js 是一个基于Vue.js的通用应用框架,预设了利用Vue.js开发服务端渲染的应用所需要的各种配置,只需要安装官方文档的要求进行开发,就可以很好的解决SSR的问题.我们以一个简单的博客为例,来实践一下Nuxt.js. 项目介绍 当前基于Nuxt.js的简化版博客,包括注册.登录.文章列表页面.文章详情页.以及用户列表页等几个页面,用户信息使用

  • 使用vuepress搭建静态博客的示例代码

    什么是vuePress vuePress是以vue驱动的主题系统的简约静态网站生成工具(拥有自己的默认主题). veuPress由vue,vue-router,webpack驱动的单页面应用,每个markdonw文件都使用markdonw-it编译为html文件,然后作为vue组件的模板来处理. 中文官网 VuePress仓库 项目地址 VuePress 有很多优点: 界面简洁优雅(个人感觉比 HEXO 好看) 容易上手(半小时能搭好整个项目) 更好的兼容.扩展 Markdown 语法 响应式布

  • PHP+Ajax实现的博客文章添加类别功能示例

    PHP+Ajax实现的博客文章添加类别功能示例

    本文实例讲述了PHP+Ajax实现的博客文章添加类别功能.分享给大家供大家参考,具体如下: 一. 代码 fun.js function saveType(typename, username){ if(typename==''){ //判断博客类别是否为空 alert('请输入类别名称!'); }else if(username==''){ //判断用户名是否为空 alert('请输入用户名!'); }else{ var xmlObj; //定义XMLHttpRequest对象 var urlD

  • Android未读消息拖动气泡示例代码详解(附源码)

    Android未读消息拖动气泡示例代码详解(附源码)

    前言 拖动清除未读消息可以说在很多应用中都很常见,也被用户广泛接受.本文是一个可以供参考的Demo,希望能有帮助. 提示:以下是本篇文章正文内容,下面案例可供参考 最终效果图及思路 实现关键: 气泡中间的两条边,分别是以ab,cd为数据点,G为控制点的贝塞尔曲线. 步骤: 绘制圆背景以及文本:连接情况绘制贝塞尔曲线:另外端点绘制一个圆 关键代码 1.定义,初始化等 状态:静止.连接.分离.消失 在onSizeChanged中初始化状态,固定气泡以及可动气泡的圆心 代码如下(示例): @Overr

  • Django与AJAX实现网页动态数据显示的示例代码

    前言 这部分已经折腾我两天了,还是没有头绪,可能还会折腾更久,最后在第三天上午解决问题,在一个不起眼的地方被坑了,jQuery加载的问题.会者不难,难者不会,希望后面人少走弯路吧 环境 windows10 pycharm2017.3.3 professional edition python3.6.4 django2.0.2 方法 创建后台读取数据函数,用于后台从数据库读取数据.在views.py文件内增加以下代码 from django.http import JsonResponse def

  • ajax jquery 异步表单验证示例代码

    ajax jquery 异步表单验证示例代码

    文件目录:  html代码: 复制代码 代码如下: <html> <head> <title>异步表单验证</title> <script type='text/javascript' src='jquery.js' ></script> <script> function checkname(){ //$("input[name='name']").val() $.ajax({ type:"

  • ajax提交加载进度条示例代码

    ajax提交加载进度条示例代码

    实现效果图  加载图片  实现方式: 在jsp页面中加入 样式 复制代码 代码如下: .progress{z-index: 2000} .mask{position: fixed;top: 0;right: 0;bottom: 0;left: 0; z-index: 1000; background-color: #2F2F2F} 节点 复制代码 代码如下: <img id="progressImgage" class="progress" style=&qu

随机推荐