nodelist

Typescript,'NodeListOf<Element>' is not an array type or a string type

你。 提交于 2020-07-18 03:36:30
问题 Converting my JS to TS strict mode. The following syntax looks fine to me but TS is complaining in the for loop on allSubMenus with: [ts] Type 'NodeListOf<Element>' is not an array type or a string type. What am I missing? function subAct(target:Node){ const allSubMenus : NodeListOf<Element> = document.querySelectorAll('.subMenuItems') for (const sub of allSubMenus){ sub.classList.remove('active') } } 回答1: You need to set the target compiler option to es6 or higher for NodeListOf<T> to be

NodeList 和 HTMLCollection

爷,独闯天下 提交于 2020-03-09 16:48:43
NodeList 类数组对象 代表节点的集合 部分浏览器为NodeList加入了namedItem接口。 规范: http://www.w3.org/TR/REC-DOM-Level-1/level-one-core.html#ID-536297177 HTMLCollection 类数组对象 代表HTML元素的集合 可以使用namedItem接口,以id(优先)或name获取集合中的元素。 规范: http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-75708506 NodeList的[]操作符 同item接口,可以通过索引值获取元素。例如, nodelist[0]。 同namedItem接口,可以通过id或name获取集合中的元素。例如,nodelist['name']。 实时对象 实时对象的意思是,文档内容的变化会立即体现在对象上。 document.getElementsByName, document.getElementsByClassName, document.getElementsByTagName, document.getElementsByTagNameNS 返回的是实时对象 document.links, document.forms, document.images, document.scripts,

JavaScript iterate through NodeList [duplicate]

别说谁变了你拦得住时间么 提交于 2020-03-05 04:18:27
问题 This question already has answers here : Why doesn't nodelist have forEach? (10 answers) Looping through a nodelist JS (1 answer) Closed 8 months ago . I am looking for a best way to iterate through NodeList excluding length. I am using: var foo = document.querySelectorAll('[id^=foo_id]') console.log(foo) Returned NodeList has all the required elements + the last entry of length:. 0: input#foo_id_... 1: input#foo_id_... .................. n: input#foo_id_... length: n+1 I wonder what the most

Element innerHTML getting rid of event listeners [duplicate]

旧时模样 提交于 2020-02-23 05:53:33
问题 This question already has answers here : Is it possible to append to innerHTML without destroying descendants' event listeners? (13 answers) Closed 3 years ago . I have a function for adding buttons to a page. var count = 0; function createOnclickFunction(number) { return function() { alert("This is button number " + number); } } function addButton(data) { var newbutton = "..." //creates string from data var element = document.getElementById("mydiv"); var children = element.children; element

Convert script to handle multiple tables independently

 ̄綄美尐妖づ 提交于 2020-01-05 09:35:30
问题 I have two scripts which work perfectly when a page contains a single table. However, now I have need to put multiple tables on the same page which support the same functions. I need some help converting these two scripts to work with multiple tables on the same page, while maintaining the same functionality. The first script is called "TABLE DATA STATES". The second script is called "SORT TABLE DATA". Current JSBin: https://jsbin.com/noyoluhasa/1/edit?html,js,output // ======================

Why does JavaScript's getElementsByClassName provide an object that is NOT an array?

若如初见. 提交于 2020-01-03 11:02:41
问题 I'm trying to get a list in JavaScript (not using jQuery) of all the elements on the page with a specific class name. I therefore employ the getElementsByClassName() function as follows: var expand_buttons = document.getElementsByClassName('expand'); console.log(expand_buttons, expand_buttons.length, expand_buttons[0]); Note that I have three anchor elements on my page with the class 'expand'. This console.log() outputs [] 0 undefined Next, for kicks, I threw expand_buttons into its own array

Why does JavaScript's getElementsByClassName provide an object that is NOT an array?

ぐ巨炮叔叔 提交于 2020-01-03 11:02:23
问题 I'm trying to get a list in JavaScript (not using jQuery) of all the elements on the page with a specific class name. I therefore employ the getElementsByClassName() function as follows: var expand_buttons = document.getElementsByClassName('expand'); console.log(expand_buttons, expand_buttons.length, expand_buttons[0]); Note that I have three anchor elements on my page with the class 'expand'. This console.log() outputs [] 0 undefined Next, for kicks, I threw expand_buttons into its own array

Is it possible to append an element to a JavaScript nodeList?

穿精又带淫゛_ 提交于 2020-01-01 08:44:23
问题 I'm generating content dynamically, so I'm often ending up with documentFragments which I'm querying using querySelectorAll or querySelector returning a nodeList of elements inside my documentFragment. From time to time I would like to add an item to a list, but I can't find anything online on whether this is even possible. I tried it like this: document.querySelectorAll(".translate").item(length+1) = document.createElement("div"); and this: document.querySelectorAll(".translate").shift

NodeList object in javascript

≡放荡痞女 提交于 2019-12-28 08:07:32
问题 Can anyone tell me what kind of object the NodeList is. I read that it is an array-like object and that it can be accessed via bracket notation, for example var a = someNode.childNode[0]; . How is this possible since via bracket notation we can only access to the properties of an object, and as i know we can not have 回答1: A NodeList is collection of DOM elements . It's like an array (but it isn't). To work with it, you must turn it into a regular JavaScript array. The following snippet can

Specify an array without jQuery and without NodeLists

余生颓废 提交于 2019-12-25 04:48:10
问题 Challenge = how to specify an array without jQuery and without NodeLists. Currently, I use the following, with jQuery: $('audio') and then iterate over each <audio> element and this definitely works. I iterate over this array with a conventional for-loop, or even using the .each construct. However, in an attempt to avoid jQuery and without nodeLists, I am totally clueless. How I wish document.querySelectorAll("audio") would be a non-jQuery equivalent of $('audio') , but it does not appear to