js实现网页收藏功能

2024-09-29 10:47:59

本文实例讲述了js实现动态添加或删除网址功能的方法。分享给大家供大家参考，具体如下：

运行效果图：

具体代码如下

<html>
 <head>
 <title>我们</title>
 <meta charset="utf-8">
 <script>
 function add(){
  var name = document.getElementById("name").value;
  var url = document.getElementById("url").value;
  var list = document.getElementById("list");
  //动态创建节点
  var link = document.createElement("a");
  link.setAttribute("href",url); //设置属性
  link.innerHTML = name;
  //增加删除的按钮
  var button = document.createElement("input");
  button.setAttribute("type","button");
  button.value = "删除";
  /**
  (1).event对象表示对象的状态，提供了对象的相关细节,IE浏览器被
  存储在 Window 对象的 event 属性中。
  (2).srcElement属性是对于生成事件的 Window 对象、Document 对象或 Element 对象的引用
  (3).parentNode 属性返回指定节点的父节点。
  (4).removeChild() 方法删除子节点。

  **/
  button.onclick = function(event){
  var target;
  if (event == null)
  {
   target = window.event.srcElement;
  }else{
   target = event.target;
  }
  var div = target.parentNode;
  div.parentNode.removeChild(div);
  alert("删除成功");
  }
  //添加生成的内容
  var div = document.createElement("div");
  div.appendChild(button);
  div.insertBefore(link,button);
  list.appendChild(div);

  }
 </script>
 </head>
 <body>
 <hr>
 站点名称：<input type="text" name="name" id="name">
 网址：<input type="text" name="url" id="url">
 <input type="button" value="增加" onclick="add()">
 <div id="list">
 </div>
 </body>
</html>

希望本文所述对大家JavaScript程序设计有所帮助。

设为首页与加入收藏的JS代码(多浏览器支持)

最新的支持IE.firefox.chrome有提示信息的代码: <script type="text/javascript"> //设为首页 www.jb51.net function SetHome(obj,url){ try{ obj.style.behavior='url(#default#homepage)'; obj.setHomePage(url); }catch(e){ if(window.netscape){ try{ netscape.security.P
JS鼠标事件大全推荐收藏

一般事件事件浏览器支持描述 onClick HTML: 2 | 3 | 3.2 | 4 Browser: IE3 | N2 | O3 鼠标点击事件,多用在某个对象控制的范围内的鼠标点击 onDblClick HTML: 2 | 3 | 3.2 | 4 Browser: IE4 | N4 | O 鼠标双击事件 onMouseDown HTML: 2 | 3 | 3.2 | 4 Browser: IE4 | N4 | O 鼠标上的按钮被按下了 onMouseUp HTML: 2 | 3 | 3
完美兼容IE,chrome,ff的设为首页、加入收藏及保存到桌面js代码

今天给大家分享一段设为首页.收藏本站及保存到桌面的js代码,非常实用. 复制代码代码如下: <script type="text/javascript"> //设为首页 function SetHome(obj,url){ try{ obj.style.behavior='url(#default#homepage)'; obj.setHomePage(url); }catch(e){ if(window.
添加到收藏夹的Javascript脚本 for ie,firefox

From: http://blog.donews.com/dodo 在IE,FF下测试通过,在TE无效. function addBookmark(title,url) { if (window.sidebar) { window.sidebar.addPanel(title, url,""); } else if( document.all ) { window.external.AddFavorite( url, title); } else if( window.opera &
JS 加入收藏夹的代码(主流浏览器通用)

所有浏览器通用的js添加收藏夹代码复制代码代码如下: <script> function addfavorite() { if (document.all) { window.external.addFavorite('http://www.XXX.com','XXX'); } else if (window.sidebar) { window.sidebar.addPanel('XXX', 'http://www.XXX.com', ""); } } </scr
javascript 设为首页与加入收藏兼容多浏览器代码

代码: 复制代码代码如下: <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title>无标题页</title> <script language="javascript" type="text/javascript"> function AddFavorite(sURL, sTi
js Firefox 加入收藏夹功能代码兼容Firefox 和 IE

完整代码如下:chrome下也有提示,说实话一般这类代码一般都是IE下使用,其它浏览器也只是给个提示了. <script type="text/javascript"> //设为首页 www.jb51.net function SetHome(obj,url){ try{ obj.style.behavior='url(#default#homepage)'; obj.setHomePage(url); }catch(e){ if(window.netscape){ try
javascript 加入收藏、设为首页(IE,firefox兼容脚本之家版)

具体的演示,可以参考我们最下面的加入收藏设为首页功能. function addBookmark(title,url) { if (window.sidebar) { window.sidebar.addPanel(title,url,""); } else if( document.all ) { window.external.AddFavorite(url,title); } else if( window.opera && window.print ) {
js实现网页收藏功能

本文实例讲述了js实现动态添加或删除网址功能的方法.分享给大家供大家参考,具体如下: 运行效果图: 具体代码如下 <html> <head> <title>我们</title> <meta charset="utf-8"> <script> function add(){ var name = document.getElementById("name").value; var url = do
JS实现网页抢购功能（触发，终止脚本）

以下我们是通过chrome浏览器的开发者功能,实现如何用JS代码完成抢购功能以及如何通过chrome浏览器调试并加载自己写的JS. 身为一名前端开发工程师,有时候业务场景是无法用手速模拟的,老司机也有翻车的时候[你懂得].因此我特意写这一篇文章,希望能够对大家有所帮助. 涉及到的内容: 1.chrome浏览器 2.js代码 3.函数节流第一步打开chrome浏览器,使用组合键Ctrl+shift+i打开开发者工具,接下来如图所示. 点击snippets 第二步如图所示点击new snip
JS实现基本的网页计算器功能示例

本文实例讲述了JS实现基本的网页计算器功能.分享给大家供大家参考,具体如下: <html> <head> <title>网页计算机</title> <meta charset="UTF-8"/> <style type="text/css"> #jsjdiv{ border: solid 1px black; border-radius: 5px; width: 200px; /*height:
JS利用window.print()实现网页打印功能

目录前言一.print()方法二.打印样式 1.使用打印样式表 2.使用媒介查询 3.内联样式使用media属性 4.在css中使用@import引入打印样式表三.打印指定区域部分内容 1.方法一 2.方法二 3.方法三四.强制插入分页五.设置打印布局(横向.纵向.边距) 六.去除浏览器默认页眉页脚七.打印方法封装前言 print作为浏览已经比较成熟的技术可以经常被用来打印页面的部分内容,我们可以在MDN上查看到相关的简单介绍. 一.print()方法 print() 方法用于打
js实现网页同时进行多个倒计时功能

本文实例为大家分享了js实现网页同时进行多个倒计时的具体代码,供大家参考,具体内容如下创建一个时间类Timer. 每个商品的倒计时生成一个实例:var time = new Timer(); /** *startime 应该是毫秒数 */ var Alarm = function (startime, endtime, countFunc, endFunc) { this.time = Math.floor((endtime - startime) / 1000); //时间 this.cou
nodeJS实现简单网页爬虫功能的实例(分享)

本文将使用nodeJS实现一个简单的网页爬虫功能网页源码使用http.get()方法获取网页源码,以hao123网站的头条页面为例 http://tuijian.hao123.com/hotrank var http = require('http'); http.get('http://tuijian.hao123.com/hotrank',function(res){ var data = ''; res.on('data',function(chunk){ data += chunk;
jQuery利用cookie 实现本地收藏功能(不重复无需多次命名)

1.cookie是什么: ①.cookie 是存储于访问者计算机中的变量.每当一台计算机通过浏览器来访问某个页面时,那么就可以通过 JavaScript 来创建和读取 cookie. ②.实际上 cookie 是存于用户硬盘的一个文件,这个文件通常对应于一个域名,当浏览器再次访问这个域名时,便使这个cookie可用.因此,cookie可以跨越一个域名下的多个网页,但不能跨越多个域名使用. ③.不同浏览器对 cookie 的实现也不一样.即保存在一个浏览器中的 cookie 到另外一个浏览器是不
利用Node.JS实现邮件发送功能

第一步.配置篇首先需要安装nodemailer库 npm install nodemailer//默认会安装最新的版本. 关于这个库的文档参见nodemailer 第二步.库的一些使用介绍这个库使用方法很简单的.首先是要创建一个用于发送邮件的实例 var transporter = nodemailer.createTransport(transport[, defaults]) transport参数属性属性太多了就只写一些关键的属性 port:连接的端口号,一般就是465 host:你
js给网页加上背景音乐及选择音效的方法

本文实例讲述了js给网页加上背景音乐及选择音效的方法.分享给大家供大家参考.具体实现方法如下: 复制代码代码如下: <HTML> <HEAD> <TITLE>给网页加上背景音乐,选择音效功能</TITLE> <STYLE>  a{font-size:30pt;color:blue;font-family:Vineta BT} a:link{text-decoration:none;} a:hover{text-
js实现网页抽奖实例

本文实例讲述了js实现网页抽奖的方法.分享给大家供大家参考.具体如下: 这段网页抽奖程序,基于javascript代码实现,简单的演示如何使用JS来实现抽奖功能,点击"开始抽奖"按钮,程序即开始抽奖了,需要停止的时候按"停止",以前发过类似的抽奖程序有几个了,有兴趣的自己在本站网页特效栏目搜索"抽奖"看下. 运行效果如下图所示: 具体代码如下: <!DOCTYPE html> <html lang="zh"&

js实现网页收藏功能

相关推荐

随机推荐