JS显示文献来源和缩略词

<html>
<head>
<title></title>
<style type="text/css">
abbr{
text-decoration:underline;
}
body{
background-color:#ccc;
color:#333;
font-size: 20px;
}
</style>
</head>
<body>
<h1>what is the Document Object Model?</h1>
<p>
The <abbr title="World Wide Web Consortium">W3C</abbr> defines the <abbr title="Document Object Model">DOM</abbr> as:
</p>
<blockquote cite="http://www.w3.org/DOM/">
<p>
A platform and languange-neutral interfa5ce that will allow programs and
scripts to dynamically access and update the content,structer and style of documents.
</p>
</blockquote>
<p>
It is an <abbr title="Application Programming Interface">API</abbr> that can be used to navigate <abbr title="HyperText Markup Languange">HTML</abbr> and <abbr title="eXtend Markup Language">XML</abbr> documents.
</p>
</body>
<script>
window.onload = function(){
displayAbbreviations();
displayCitations();
};
//此函数显示缩略词
function displayAbbreviations(){
var abbereviations = document.getElementsByTagName("abbr");
if(abbereviations.length<1){
return false;
}
//自己的方法
// for(var i = 0;i<abbereviations.length;i++){
// var body_element = document.getElementsByTagName("body")[0];
// var text = abbereviations[i].lastChild.nodeValue;
// var discription = abbereviations[i].getAttribute("title");
// alert(text);
// var def = document.createElement("p");
// var info = document.createTextNode(text+" "+discription);
// def.appendChild(info);
// body_element.appendChild(def);

// }
//教材方法
var defs = new Array();
for(var i = 0;i<abbereviations.length;i++){
var current_abbbr = abbereviations[i];
if(current_abbbr.childNodes.length<1) continue;
var definition = abbereviations[i].getAttribute("title");
var key = abbereviations[i].lastChild.nodeValue;
defs[key] = definition;
}
//创建标记
var dlist = document.createElement("dl");
for(key in defs){
var definition = defs[key];
var dtitle = document.createElement("dt");
var dtitle_text = document.createTextNode(key);
dtitle.appendChild(dtitle_text);
var ddesc = document.createElement("dd");
var ddesc_text = document.createTextNode(definition);
ddesc.appendChild(ddesc_text);
dlist.appendChild(dtitle);
dlist.appendChild(ddesc);
}
var header = document.createElement("h2");
var body_element = document.getElementsByTagName("body")[0];
var header_text = document.createTextNode("Abbereviations");
header.appendChild(header_text);
body_element.appendChild(header);
body_element.appendChild(dlist);
}
//此函数显示文献来源链接表
function displayCitations(){
var quotes = document.getElementsByTagName("blockquote");
for(var i =0;i<quotes.length;i++){
if(!quotes[i].getAttribute("cite")) continue;
var url = quotes[i].getAttribute("cite");
//找出quote[i]里的所有元素节点
var quotechildren = quotes[i].getElementsByTagName(‘*‘);
if(quotechildren.length<1) continue; //无子节点
var elem = quotechildren[quotechildren.length-1]; //最后一个元素节点
var link = document.createElement("a");
var link_text = document.createTextNode("source");
link.appendChild(link_text);
link.setAttribute("href",url);
var superscript = document.createElement("sup");
superscript.appendChild(link);
elem.appendChild(superscript);
}
}
</script>
</html>

时间: 2024-10-27 09:44:34

JS显示文献来源和缩略词的相关文章

SDUST作业10 Problem J: 提取缩略词

Description 在英文文献中,尤其是专业文献中,经常有很多的缩略词,如CPU代表Central Processing Unit等.为了方便学习,Qili决定从一批英文论文中提取出所有的缩略词以及它们的全称. 经过初步判断,这些文章的缩略词都是以全部大写字母的形式出现,而且每个缩略词之后会有一个空格,之后是它的全称.全称使用“()”括起来,左括号跟它后面的单词之间没有空格,右括号跟它前面的单词之间没有空格,全称的每个单词的首字母与缩略词的顺序是对应的.全称的单词之间可能有连字符“-”连接.

ldap理论属于概念缩略词

Standalone LDAP Daemon, slapd(standalone lightweight access protocol) ldap 389 default listener port ceph 6789Lightweight Directory Access Protocol LDAP目录中信息 按树型结构组织具体信息存储在条目(entry)的数据结构中;条目相当于关系型数据库中的table recored条目具有区别名DN(distinguished name)的属性(att

显示缩略列表 JS DOM

以下body部分: <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>Explaining the Ddocument Ob Model</title> <link href="style08.css" type="text/css" rel="sty

文章缩略显示

网页中文章缩略介绍第二行超出内容缩略显示 用的是-webkit-私有属性.用js已经解决.代码如下:text-overflow: -o-ellipsis-lastline;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical; 转载自网页.

JavaScript编程艺术-第8章-8.6.1-显示“缩略词语表”

8.6.1-显示"缩略词语表" ***代码亲测可用*** HTML: JS: ***end***

小组项目需求规格说明书【缩略版】

[需求规格说明]详细请见我组需求规格说明书  此处为缩略版 1.引言 1.1编写目的 为明确软件需求.安排项目规划与进度.组织软件开发与测试,撰写本文档. 本文档供项目经理.设计人员.开发人员参考. 项目目标:搭建水果预定网页端平台,并建立相应的数据库,有利于为在校大学生提供一个方便新鲜实惠的水果购买平台. 1.2项目背景 在校大学生对水果的需求量大,但是购买渠道单一,水果价格较高不实惠. "物美价廉"一直是在校大学生所追求的物质享受,而水果价格的普遍大幅度上涨,许多大学生称"

IOS如何创建视频缩略图片

//将完整的图片和缩略后的图片写入临时文件夹中     NSData *pngImage = UIImagePNGRepresentation(thumbnail);     if ([pngImage writeToFile:[NSString stringWithFormat:@"%@/tempImage.png",TEMP_FOLDER] atomically:YES]) { UIImage *myThumbNail = [[UIImage alloc] initWithData

js显示隐藏层

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-

Atitit.&#160;html&#160;使用js显示本地图片的设计方案.doc

Atitit. html 使用js显示本地图片的设计方案.doc 1.  Local mode  是可以的..web模式走有的不能兰.1 2. IE8.0 显示本地图片 img.src=本地图片路径无效的解决方案1 2.1. div来完成 .filter1 2.2. URL.createObjectURL (html5 api  ma sida)2 2.3. Css 背景(吗四大)2 2.4. 这是Data URI scheme (base64).2 3. --code2 4. 参考2 1.