鼠标指到一个文字上后,显示一个层并不奇怪。但这样的效果是定义在哪里的呢?

cul 2007-06-21 05:53:57
在当当浏览书的时候,无意中发现这样的一种效果:
http://product.dangdang.com/product.aspx?product_id=9190880

比如上边的这本书,在内容提要部分有一些蓝色的字,指向去后会显示一个层显示相关书籍。但是查看源文件,那些蓝色的字却与周围的字没有任何的不同,也没有定义什么事件在它上边,这是如何实现的呢?

<div class='right_content'>ActionScript脚本语言是用来实现Flash Player交互动功能的程序语言。本书基于Flash Professional 8 中文版开发环境,以ActionScript2.0为主线,结合示例系统阐述Flash ActionScript X应用开发的基础知识。首先从变量、函数、基本程序结构、键盘和鼠标事件等基础知识出发,然后介绍类和对象、多时间轴、组件、声音、视频、ActionScript的调试技术和动画特效技术,最后提供了ActionScript的高级应用主题,如Flash网络应用程序、以及部分技术文档,帮助读者迅速掌握Flash网络应用程序、能信应用程序的开发。另外,本书配套光盘提供了书中全部案例源文件和相关素材,以及部分技术文档,帮助读者迅速掌握Flash ActionScript X编程的基本方法。<br> 本书以案例带知识点,遵循“先效果、后过程”的讲解模式,注重相关知识的综合应用,非常适合 Flash动画设计人员、Web开发人员以及高等院校相关专业师生参考。</div>

这个层的定义很普通,但是只有鼠标指在 基础知识 几个字上才会有层弹出。
请教高手这是怎么定义的?谢谢!
...全文
367 5 打赏 收藏 转发到动态 举报
AI 作业
写回复
用AI写文章
5 条回复
切换为时间正序
请发表友善的回复…
发表回复
showrock 2007-06-22
  • 打赏
  • 举报
回复
学习
adverse 2007-06-22
  • 打赏
  • 举报
回复
一般为了不让人看到全部源码,很多网站会用js动态加些js文件,给对象加事件,或者生成一些新的对象。
所以单纯的看源文件是不行的。
sharpleaf 2007-06-22
  • 打赏
  • 举报
回复
再说一点,其实lz所谓的看到的源码那些字和其他字没任何区别,是因为你看的并不是当时真正的源码(脚本动态添加的dom没有反映出来),你用ie toolbar参看部分dom源码得到真正源码如下(直接用脚本document.documentElement也可以):

应用开发的<SPAN class=t1 onmouseover=getSearchList(this,event)
onmouseout=keypop.hide() name="skey"><A
href="http://search.dangdang.com/search.aspx?type=notice&key=%u57FA%u7840%u77E5%u8BC6"
target=_blank>基础知识</A></SPAN>
sharpleaf 2007-06-22
  • 打赏
  • 举报
回复
没这么严重吧~ 呵呵,基本原理用关联的js为指定的关键字动态添加事件,就像你用脚本动态为dom元素添加事件性质一样
FuWaer 2007-06-21
  • 打赏
  • 举报
回复
###################################################################################
郑重声明:本回帖内容完全出于对楼主所提问题找答案而编写,全无窥探当当网代码之恶意!
###################################################################################

在楼主给出的页面,察看原文件,在最后部分有如下两行代码
-----------------------------------------------------------------
<script type="text/javascript" src="http://search.dangdang.com/KeyMark/js/searchkey20070404.js"></script>
<script type="text/javascript">noticeKey('9190880');</script>
-----------------------------------------------------------------
就是脚本文件http://search.dangdang.com/KeyMark/js/searchkey20070404.js里面的函数noticeKey()负责在页面内容加载完成后来负责将制定的关键词上添加鼠标事件的。

在这个js文件中,函数noticeKey()代码如下:
-----------------------------------------------------------------
function noticeKey(pid)
{
ppid=pid;
t1=new Date();
HttpRequest = new ActiveXObject("Microsoft.XMLHTTP");
HttpRequest.onreadystatechange = getProductKeyProcessResponse;
HttpRequest.open("POST", AGENT_URL, true);
//HttpRequest.setRequestHeader("if-Modified-Since","0");
HttpRequest.setRequestHeader("Content-Type", "application/x-www-form-urlencoded;charset=utf-8");
try
{
HttpRequest.send("request_url="+PRODUCT_KEY_URL+"&pid="+pid);
} catch (e)
{
}
}
-----------------------------------------------------------------
其中通过xmlhttp异步等向后台请求产品id为pid的关键词。
HttpRequest.onreadystatechange = getProductKeyProcessResponse;
当xmlhttp请求到达后,回调getProductKeyProcessResponse()
该函数代码是:
-----------------------------------------------------------------
function getProductKeyProcessResponse()
{
if(HttpRequest.readyState == 4)
{
if(HttpRequest.status != 200)
return;

var result = HttpRequest.responseText;
var keys = result.split(",");
var r,rp;
for(var i=0;i<keys.length;i++)
{
if(keys[i]!=null && keys[i]!="")
{
r=window.document.body.createTextRange();
for(var j=0;r.findText(keys[i]);j++)
{
rp=r.parentElement();
if(rp.className=="right_content")
{
r.pasteHTML("<span name='skey' class='t1' onmouseover='getSearchList(this,event)' onmouseout='keypop.hide()'><a href='"+SEARCH_URL+escapeKey(keys[i])+"'target='_blank'>"+keys[i]+"</a></span>");
r.collapse(false);
break;
}
r.collapse(false);
}
}
}
var t2=new Date();
var seconds=t2.getMilliseconds()-t1.getMilliseconds();
if(seconds<0) seconds=1000+seconds;
//alert("客户端JS标注时间:"+seconds+"毫秒!");
}
}
-----------------------------------------------------------------
其中,
for(var i=0;i<keys.length;i++)
{
if(keys[i]!=null && keys[i]!="")
{
r=window.document.body.createTextRange();
for(var j=0;r.findText(keys[i]);j++)
{
rp=r.parentElement();
if(rp.className=="right_content")
{
r.pasteHTML("<span name='skey' class='t1' onmouseover='getSearchList(this,event)' onmouseout='keypop.hide()'><a href='"+SEARCH_URL+escapeKey(keys[i])+"'target='_blank'>"+keys[i]+"</a></span>");
r.collapse(false);
break;
}
r.collapse(false);
}
}
这个脚本段会遍历得到的需要添加事件的关键词数组,对每个关键词在当前document.body内找,如果找到,则替换为一个带了事件的span

52,792

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 Ajax
社区管理员
  • Ajax
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧