JS远程获取网页源代码实例


Posted in Javascript onSeptember 05, 2013
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 
<html> 
<head> 
<meta http-equiv="Content-type" content="text/html; charset=utf-8"> 
<title>远程网页源代码读取</title> 
<style type="text/css"> 
/* 页面字体样式 */ 
body, td, input, textarea { 
font-family:Arial; 
font-size:12px; 
} 
</style> 
<script type="text/javascript"> 
//用于创建XMLHttpRequest对象 
function createXmlHttp() { 
//根据window.XMLHttpRequest对象是否存在使用不同的创建方式 
if (window.XMLHttpRequest) { 
xmlHttp = new XMLHttpRequest(); //FireFox、Opera等浏览器支持的创建方式 
} else { 
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");//IE浏览器支持的创建方式 
} 
} 
//直接通过XMLHttpRequest对象获取远程网页源代码 
function getSource() { 
var url = document.getElementById("url").value; //获取目标地址信息 
//地址为空时提示用户输入 
if (url == "") { 
alert("请输入网页地址。"); 
return; 
} 
document.getElementById("source").value = "正在加载……"; //提示正在加载 
createXmlHttp(); //创建XMLHttpRequest对象 
xmlHttp.onreadystatechange = writeSource; //设置回调函数 
xmlHttp.open("GET", url, true); 
xmlHttp.send(null); 
} 
//将远程网页源代码写入页面文字区域 
function writeSource() { 
if (xmlHttp.readyState == 4) { 
document.getElementById("source").value = xmlHttp.responseText; 
} 
} 
</script> 
</head> 
<body> 
<h1>远程网页源代码读取</h1> 
<div> 
地址:<input type="text" id="url"> 
<input type="button" onclick="getSource()" value="获取源码"> 
</div> 
<textarea rows="10" cols="80" id="source"></textarea> 
</body> 
</html>
Javascript 相关文章推荐
Window.Open如何在同一个标签页打开
Jun 20 Javascript
html的DOM中document对象forms集合用法实例
Jan 21 Javascript
jQuery实现图片左右滚动特效
Apr 20 Javascript
jQuery技巧之让任何组件都支持类似DOM的事件管理
Apr 05 Javascript
js学习阶段总结(必看篇)
Jun 16 Javascript
Angular外部使用js调用Angular控制器中的函数方法或变量用法示例
Aug 05 Javascript
jQuery实现页面顶部下拉广告
Dec 30 Javascript
vue.js项目打包上线的图文教程
Nov 16 Javascript
利用vue+elementUI实现部分引入组件的方法详解
Nov 22 Javascript
关于redux-saga中take使用方法详解
Feb 27 Javascript
js中getter和setter用法实例分析
Aug 14 Javascript
原生JS实现随机点名项目的实例代码
Apr 30 Javascript
JSON序列化与解析原生JS方法且IE6和chrome测试通过
Sep 05 #Javascript
HTML页面滚动时获取离页面顶部的距离2种实现方法
Sep 05 #Javascript
JavaScript移除数组元素减少长度的方法
Sep 05 #Javascript
js编码、解码函数介绍及其使用示例
Sep 05 #Javascript
Jquery中给animation加更多的运作效果实例
Sep 05 #Javascript
Jquery增加鼠标中间功能mousewheel的实例代码
Sep 05 #Javascript
jQuery关于导航条背景切换效果实现示例
Sep 04 #Javascript
You might like
骨王战斗力在公会成员中排不进前五,却当选了会长,原因竟是这样
2020/03/02 日漫
php中将地址生成迅雷快车旋风链接的代码[测试通过]
2011/04/20 PHP
php使用cookie显示用户上次访问网站日期的方法
2015/01/26 PHP
Ubuntu VPS中wordpress网站打开时提示”建立数据库连接错误”的解决办法
2016/11/03 PHP
YII2 实现多语言配置的方法分享
2017/01/11 PHP
PHP+Ajax实现的博客文章添加类别功能示例
2018/03/29 PHP
Windows上php5.6操作mongodb数据库示例【配置、连接、获取实例】
2019/02/13 PHP
来自chinaz的ajax获取评论代码
2008/05/03 Javascript
JS+CSS设置img在DIV中只显示Img垂直居中的部分
2013/10/24 Javascript
input链接页面、打开新网页等等的具体实现
2013/12/30 Javascript
jQuery大于号(&gt;)选择器的作用解释
2015/01/13 Javascript
JS实现兼容性较好的随屏滚动效果
2015/11/09 Javascript
javascript实现查找数组中最大值方法汇总
2016/02/13 Javascript
Vue.js 2.0中select级联下拉框实例
2017/03/06 Javascript
JavaScript数据结构之数组的表示方法示例
2017/04/12 Javascript
js使用i18n实现页面国际化的方法
2017/05/09 Javascript
JavaScript解析任意形式的json树型结构展示
2017/07/23 Javascript
Webpack性能优化 DLL 用法详解
2017/08/10 Javascript
vue2.0设置proxyTable使用axios进行跨域请求的方法
2017/10/19 Javascript
vue 实现剪裁图片并上传服务器功能
2018/03/01 Javascript
小程序自定义组件实现城市选择功能
2018/07/18 Javascript
webpack4.x CommonJS模块化浅析
2018/11/09 Javascript
vue  directive定义全局和局部指令及指令简写
2018/11/20 Javascript
微信小程序当前时间时段选择器插件使用方法详解
2018/12/28 Javascript
vue-router之解决addRoutes使用遇到的坑
2020/07/19 Javascript
微信小程序自定义底部弹出框动画
2020/11/18 Javascript
Python命名空间详解
2014/08/18 Python
Python中低维数组填充高维数组的实现
2019/12/02 Python
CSS3轻松实现清新 Loading 效果的简单实例
2016/06/06 HTML / CSS
用CSS3绘制三角形的简单方法
2015/07/17 HTML / CSS
铭万公司.net面试题笔试题
2014/07/20 面试题
《四季》教学反思
2014/04/08 职场文书
土建专业大学生自荐信范文
2014/04/09 职场文书
表彰大会策划方案
2014/05/13 职场文书
校园广播稿100字
2014/10/06 职场文书
2016年大学生社会实践心得体会
2015/10/09 职场文书