我正在动态生成内容,所以我经常最终会documentFragments查询我在documentFragment中使用querySelectorAll或querySelector返回nodeList的元素.
我不时会在列表中添加一个项目,但我无法在网上找到关于这是否可行的任何内容.
我试过这样的:
document.querySelectorAll(".translate").item(length+1) = document.createElement("div");
Run Code Online (Sandbox Code Playgroud)
还有这个:
document.querySelectorAll(".translate").shift(document.createElement("div"));
Run Code Online (Sandbox Code Playgroud)
但两者都不起作用(如预期的那样)
问题:
是否可以手动将元素添加到NodeList?我猜,不过还是要问.
感谢您的一些见解?
编辑:
更多信息:我正在生成一个动态内容块,我想附加到我的页面.默认情况下,该块为英文.由于用户正在用中文查看页面,我正在动态片段上运行翻译器,然后将其附加到DOM.在我的页面上,我还有一个元素,比如一个标题,它应该根据添加的动态内容而改变.我的想法是一步到位=尝试添加一个元素到我的nodeList.但是现在写它...我想不可能:-)
在我的一个变量上做一个alert()给了我这个结果
[object NodeList]
Run Code Online (Sandbox Code Playgroud)
我怎样才能看到其中的所有值?
注意; 我在Firefox上,不知道如何使用chromebug,所以它没有安装.
据我所知,IE8可以访问该Array.prototype.slice方法.然而,当我试图将它NodeList变成一个数组时,它给了我错误Array.prototype.slice: 'this' is not a JavaScript object.你可以在这里查看,或者在这里查看我的代码:
HTML
<div id="test">Test</div>
Run Code Online (Sandbox Code Playgroud)
JavaScript的
var divs = document.getElementsByTagName('div');
divs = Array.prototype.slice.call(divs);
console.log(divs);
Run Code Online (Sandbox Code Playgroud)
这里发生了什么?
我正在使用forEach循环遍历nodeList.我的代码如下
var array = document.querySelectorAll('items');
array.forEach(function (item) {
console.log(item);
});
Run Code Online (Sandbox Code Playgroud)
并且此代码抛出错误
未捕获的TypeError:array.forEach不是函数
然后在阅读了几篇在线博客文章后,我将代码改为此.
[].forEach.call(array, (function (item) {
console.log(item);
}));
Run Code Online (Sandbox Code Playgroud)
有人可以解释为什么不能在nodeList上调用forEach以及上面的第二个代码片段做了什么.:)
编辑: 7/25/2017
此问题对现代浏览器无效.您可以在其中的节点列表上使用forEach
尽管NodeList不是数组,但可以使用forEach()对其进行迭代.它也可以使用Array.from()转换为Array.
但是,一些较旧的浏览器尚未实现NodeList.forEach()和Array.from().但是使用Array.prototype.forEach()可以避免这些限制(本文档中有更多内容).
参考:MDN
将我的JS转换为TS严格模式(非常头痛哈哈)
下面的语法看起来好像没什么问题,但TS在抱怨for环路上allSubMenus有:
[ts] Type 'NodeListOf<Element>' is not an array type or a string type.
我想念什么
function subAct(target:Node){
const allSubMenus : NodeListOf<Element> = document.querySelectorAll('.subMenuItems')
for (const sub of allSubMenus){
sub.classList.remove('active')
}
}
Run Code Online (Sandbox Code Playgroud) 我很难NodeList在IE 8 中将数据转换为数组.以下在Chrome中完美运行,但在IE 8 toArray()中无法识别为有效:
NodeList.prototype.toArray = function() {
var a = [];
for (var i = 0, len = this.length; i < len; i++) {
a[i] = this[i];
}
return a;
}
document.all.tags("div").toArray();
Run Code Online (Sandbox Code Playgroud)
我尝试将一个原型函数添加到一个数组只是为了检查我的理智,它正常工作.这让我觉得IE 8实际上并没有返回NodeList?这是一个完整的例子:
我究竟做错了什么?
这是我的代码:
// get the factory
DocumentBuilderFactory dbf = DocumentBuilderFactory.newInstance();
try {
// Using factory get an instance of document builder
DocumentBuilder db = dbf.newDocumentBuilder();
// parse using builder to get DOM representation of the XML file
dom = db.parse(file);
} catch (ParserConfigurationException pce) {
pce.printStackTrace();
} catch (SAXException se) {
se.printStackTrace();
} catch (IOException ioe) {
ioe.printStackTrace();
}
NodeList n1 = dom.getChildNodes();
Element e1 = (Element) n1.item(0);
System.out.println(n1.getLength());
System.out.println(e1.getNodeName());
NodeList n2 = n1.item(0).getChildNodes();
Element e2 = (Element) n2.item(0); //Line 61 …Run Code Online (Sandbox Code Playgroud) 我正在尝试合并两个xml文件,如下所示,但我无法获得所需的输出请帮助我谢谢
Java代码:
DocumentBuilderFactory domFactory = DocumentBuilderFactory.newInstance();
domFactory.setIgnoringComments(true);
DocumentBuilder builder = domFactory.newDocumentBuilder();
Document doc = builder.parse(new File("file1.xml"));
Document doc1 = builder.parse(new File("file2.xml"));
NodeList nodes = doc.getElementsByTagName("staff");
NodeList nodes1 = doc1.getElementsByTagName("staff");
for(int i=0;i<nodes1.getLength();i=i+1){
Node n= (Node) doc.importNode(nodes1.item(i), true);
nodes.item(i).getParentNode().appendChild(n);
}
Transformer transformer = TransformerFactory.newInstance().newTransformer();
transformer.setOutputProperty(OutputKeys.INDENT, "yes");
StreamResult result = new StreamResult(new StringWriter());
DOMSource source = new DOMSource(doc);
transformer.transform(source, result);
Writer output = null;
output = new BufferedWriter(new FileWriter("mergedxml.xml"));
String xmlOutput = result.getWriter().toString();
output.write(xmlOutput);
output.close();
System.out.println("merge complete");
Run Code Online (Sandbox Code Playgroud)
File1.xml
<company>
<staff>
<name>john</name>
<phone>465456433</phone>
<email>gmail1</email> …Run Code Online (Sandbox Code Playgroud) 我认为应该是一个直截了当的问题; 让我快速解释一下:
在我的JavaScript中,请food.xml阅读:
getMenuXml.open("GET","food.xml",false);
getMenuXml.send();
xmlDoc=getMenuXml.responseXML;
xmlFoodList = xmlDoc.getElementsByTagName("food");
Run Code Online (Sandbox Code Playgroud)
所以现在我有一个xmlFoodList包含所有食物元素的NodeList .到目前为止很棒.问题是我想根据<category>里面的元素对节点进行排序.我可以读到:
xmlFoodList[i].getElementsByTagName("category")[0].childNodes[0].nodeValue
Run Code Online (Sandbox Code Playgroud)
稍后在我的代码中,食物项目显示在列表中,正如您所期望的那样,我希望将同一类别的食物列在一起.所以,我的问题是:如何xmlFoodList根据类别重新排序节点?
注意:我无法更改food.xml进入,并且我不想编辑我的后期代码来进行排序,因为列表已填充.我不想将NodeList转换为数组,因为我不得不重写很多以后的代码.性能实际上并不是一个问题,因此您可以随心所欲地克隆/嵌套循环.谢谢你的时间.
所以我想要一种简单的方法来循环节点列表,但我一直讨厌不能forEach在节点列表上使用。
所以,现在我这样做:Array.prototype.forEach.call(nodeList, callback)。
对于索引,我做:Array.prototype.indexOf.call(nodeList, node)。
对于几乎所有的事情,我都在nodeLists上使用Array.prototype。
但我想知道这些是否被视为黑客?
他们的做法正确吗?
另外,假设我实际上不需要 nodeList 中的数组,那么使用它是否有优势Array.from(nodeList).forEach(callback)?