Javascript DOM 编程艺术 Chap8 显示文献来源链接表

最新推荐文章于 2024-08-15 08:55:57 发布

Bingersoda

最新推荐文章于 2024-08-15 08:55:57 发布

阅读量57

点赞数

分类专栏： when i come across it 文章标签： javascript 开发语言

本文链接：https://blog.csdn.net/Bingersoda/article/details/121163628

版权

JavaScript DOM 错误修复 appendChild 条件判断

关键词由CSDN通过智能技术生成

when i come across it 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

问题：1.把跳入下一循环的条件写错， if (quoteChildren.length < 1) continue; 写成了 if (！quoteChildren.length < 1) continue; 导致末尾的elem.appendChild(superscript); 出现appendChild undefied 问题

2.无法在页面上成功显示文献来源链接，但function写的是对的，才发现html页面内容不太一致，在blockquote下没有p元素，导致var elem = quoteChildren[quoteChildren.length - 1]; 这一句不指示blockquote下的文本内容。

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title>Explaning the document object model</title>
    <link rel="stylesheet" href="style.css">
  </head>
  <body>
    <h1>What is the Dcument 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 of learning DOM</p> 
    </blockquote>
  <p>
    It is an <abbr title="Application Programming Interface">API</abbr>
    that can be used to navigate <abbr title="HyperText Markup Language">HTML</abbr>
    and <abbr title="eXtensible Markup Language">XML</abbr> documents.
  </p>


  <script src="displayAbbreviations.js" charset="utf-8"></script>
  <script src="displayCitations.js" charset="utf-8"></script>
  <script src="addLoadEvent.js" charset="utf-8"></script>
  </body>

</html>

display citations

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");
    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);
  }
}

Bingersoda

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Javascript DOM 编程艺术 Chap8 显示文献来源链接表

问题：1.把跳入下一循环的条件写错， if (quoteChildren.length < 1) continue; 写成了 if (！quoteChildren.length < 1) continue; 导致末尾的elem.appendChild(superscript); 出现appendChild undefied 问题2.无法在页面上成功显示文献来源链接，但function写的是对的，才发现html页面内容不太一致，在blockquote下没有p元素，导致var elem ...
复制链接

扫一扫