如何更改在不同函数中创建的textNode
How to change a textNode created in a different function
我正在做一个简单的显示/隐藏脚本,其中有两段隐藏的文本。在createTextNode的帮助下,我创建了2个"阅读更多"链接。我的问题是,一旦链接被点击,隐藏的文本显示出来,链接文本"阅读更多"就会变为"隐藏",当我点击"隐藏"时,它应该会变回"阅读更多。"。但我似乎找不到更改nodeValue的正确方法,可能是因为我试图从第二个函数"hideShow"访问节点。
还有一个较小的问题。当我在头中放置链接时,我无法使脚本工作,只有当我在结束标记之前放置链接时。我知道这是一个更好的方法,但是,为什么它不起作用?和窗户有什么关系?
谢谢你的帮助!
这是我的代码:
window.onload = hideText();
function hideText() { // Function to hide text and create links
if (document.getElementsByClassName) { // Check if browser understands method
var hideElement = document.getElementsByClassName("show"); // Get all elements with class "show" and add in array "hideElement"
for (var i=0; i < hideElement.length; i++) {
var link = document.createElement("a"); // Create link for all class "show" elements
hideElement[i].parentNode.insertBefore(link, hideElement[i]); // Putting links before hidden element
link.appendChild(document.createTextNode("Read more")); // Give links a textNode child
link.setAttribute("href", "#");
link.onclick = (function(element) { //When click on link function hideShow
return function() { hideShow(element); };
})(hideElement[i]);
hideElement[i].style.display = "none"; // If no link click element with class "show" is hidden
}
}
}
function hideShow(element)
{
if (element.style.display == "none") {
element.style.display = "block";
for (var i=0; i<link.length; i++) {
link.firstChild.nodeValue = "Hide";
}
}
else {
element.style.display = "none";
}
}
上的工作示例http://jsfiddle.net/TxWQE/
函数hideText()
在function hideText()
中,您应该更改
link.onclick = (function(element) { //When click on link function hideShow
return function() { hideShow(element); };
})(hideElement[i]);
进入
link.onclick = (function(element, link) { //When click on link function hideShow
return function() { hideShow(element, link); };
})(hideElement[i], link);
函数hideShow(元素)
CCD_ 2函数应该是
function hideShow(element, link)
{
if (element.style.display == "none") {
element.style.display = "block";
link.innerHTML = "Hide";
}
else {
element.style.display = "none";
link.innerHTML = "Read more";
}
}
相关文章:
- 创建一个类似链接的按钮,并通过Javascript函数打开一个新的弹出窗口
- 为effect Composer创建GodRays效果过程
- 从javascript创建一个列表
- onkeyup无法动态创建多个文本区域
- 如何使用javascript从主svg对象动态创建svg视图框
- 如何访问声音管理器2创建的声音对象
- 我已经创建了一个jquery转盘,并使用if条件来运行和停止转盘
- Kendo:我该如何在树视图中创建一个递归的hieiarchy
- 使用Facebook live API创建实时视频对象时的隐私设置
- 在动态创建的元素上获取对特定选择器的引用
- 如何创建带有插槽的vue js组件预加载程序
- 如何在创建键时引用来自同一对象的键
- 如何创建JSON数组
- 从html创建一个指令,该指令按类名应用函数
- 使用Javascript创建测验页面
- 更改使用Chart.js创建的图表中的轴线颜色
- JavaScript名称空间和对象创建
- 如何更改在不同函数中创建的textNode
- 如何指定'x'和& # 39;y # 39;通过JavaScript创建和附加的textNode的属性
- 如何创建,表单元格与innerHTML值/ textnode通过循环数组