我有几种方法来创建这个对象
<li><a href="?">http://www.domain.com</a></li>
对于页面内容中找到的每个链接,并将它们附加到先前生成的
<ul id="container"></ul>
看起来是这样的:
var linkObject = {
parseUrl : function(url) {
"use strict";
var thisATag = document.createElement('a');
thisATag.href = url;
var thisHostName = thisATag.hostname;
return thisHostName;
},
displayLinkContainer : function() {
"use strict";
var thisWrapper = document.getElementById("contentWrapper");
var thisDiv = document.createElement("div");
thisDiv.setAttribute('id', 'wrapper');
thisWrapper.appendChild(thisDiv);
var thisHeading = document.createElement("h2");
var thisHeadingTextNode = document.createTextNode("The list of links");
thisHeading.appendChild(thisHeadingTextNode);
thisDiv.appendChild(thisHeading);
var thisUl = document.createElement("ul");
thisUl.setAttribute('id', 'container');
thisDiv.appendChild(thisUl);
},
displayLink : function(thisLink, thisActualUrl) {
"use strict";
var thisContainer = document.getElementById('container');
var thisLiTag = document.createElement('li');
var thisATag = document.createElement('a');
thisATag.setAttribute('target', '_blank');
thisATag.setAttribute('href', encodeURI(thisActualUrl));
var thisTextNode = document.createTextNode(thisLink);
thisATag.appendChild(thisTextNode);
thisLiTag.appendChild(thisATag);
thisContainer.appendChild(thisLiTag);
},
findLinks : function() {
"use strict";
var thisHrefs = [];
var thisLinks = document.getElementsByTagName('a');
if (thisLinks.length > 0) {
for (var i = 0; i < thisLinks.length; i++) {
var thisAHref = thisLinks[i].getAttribute('href');
if (thisAHref !== '#') {
var thisAUrl = linkObject.parseUrl(thisAHref);
thisHrefs.push(thisAUrl);
linkObject.displayLink(thisAUrl, thisAHref);
}
}
}
}
};
linkObject.findLinks();
的html:
<div id="contentWrapper"><a href="http://www.google.co.uk/">Google</a> <a href="http://yahoo.com">Yahoo</a></div>
如果删除
<a>
标记元素的创建,则可以正常工作,但是如果以这种方式运行,则浏览器将卡住并崩溃。知道我在做什么错吗?经过一些调试后,我发现问题出在thisActualUrl上,当我对其进行评论并替换为像这样的哈希:
thisATag.setAttribute('href', '#' /* encodeURI(thisActualUrl) */);
该代码可以正常运行,但是当与thisActualUrl一起运行时,它将显示在页面上找到的链接,然后在长循环中显示当前页面URL的链接-最终导致浏览器崩溃。
最佳答案
无法重现错误:
http://jsfiddle.net/ENXwY/
因此,问题可能出在您的thisActualUrl
参数上