With the fallowing code I want to delete the last element inside the steps variable,
var steps = $(element).find("fieldset");
var count = steps.size();
steps[count-1] = null;
but when I iterate with the each method, it doesn't seems to see the null value
steps.each(function(i) {
});
Use the slice function
steps = steps.slice(0, -1);
You could use not() to create a new jQuery object removing the elements you don't want:
steps = steps.not(steps.last());
Related
I have some tables that have data and can using it on <td>. So more like it I have something like this (show on images below)
My Element
I want to get that all positions Name and put it into an array so I can make of use that array I tried to use this code and got undefined
script.js
/** Checking if There positions name */
function checkPositions(){
let positions = document.getElementsByClassName('check-positions').innerHTML;
let array = [];
array.push(positions);
console.log(array);
}
Then how can I get that value??
The problem that you have is that document.getElementsByClassName('check-positions') returns a HTMLCollection which does not have an innerHTML property.
What you need to do is convert the HTMLCollection into an array, and then read the innerHTML property for each of the items in the array. See the following example:
const elements = document.getElementsByClassName('check-positions');
const positions = Array.from(elements).map(element => element.innerHTML);
console.log(positions);
<div class="check-positions">1</div>
<div class="check-positions">2</div>
<div class="check-positions">3</div>
Use like this
let positions = document.getElementsByClassName('check-positions')[0].innerHTML;
It's showing none because u r fatching whole array and pushing it without using indexes
Code
function checkPositions(){
all_ele = document.getElementsByClassName('check-positions')
length = all_ele.length
let array = [];
for( let i=0;i<length;i++)
{
let positions = document.getElementsByClassName('check-positions')[i].innerHTML;
array.push(positions);
}
console.log(array);
you can use jquery code to do this.
var arr = [];
$("#tablePlacement tr").each(function() {
var name = $(this).children('td.check-positions').text();
arr.push(name);
});
You should use
let positions = document.getElementsByClassName('check-positions').innerText;
I want to delete the element from json array using nodejs. My json file match.json is as follows.
[{"id":"1234","time":"3"}]
from this I want to delete the first element so that the json file looks like this:
[]
I tried the following code,its printing an empty array in the console but it is not removing the elements from the match.json file
for(var i=0;i<w;i++)
{
for(var j=0;j<m;j++){
if((words[i].id==match[j].id) && (words[i].time==match[j].time))
{
var f1=0;
//var id1=match[j].id;
var linkadd=words[i].link;
delete match[j];
console.log(match);
}
}
}
Use match.splice(i, 1) instead of delete match[i]
var arr = JSON.parse(Match_json_data);
// remove 1st element
var indexOfItemToRemove = 0;
var noOfItemsToRemove = 1;
arr.splice(indexOfItemToRemove, noOfItemsToRemove);
Reference: https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/splice?v=control
This should work:
let myJsonString = '[{"id":"1234","time":"3"}]';
let myEditedJsonString = JSON.stringify(JSON.parse(myJsonString).shift());
to remove the element..you can use splice.. The element will be removed.
{
var f1=0;
//var id1=match[j].id;
var linkadd=words[i].link;
match.splice(i, 1);
console.log(match);
}
If you use delete match[i], the list becomes [undefined]. So use splice.
So basically delete does not delete the element, rather it sets the element as undefined.
const items = [{"id":"1234","time":"3"}]
console.log('before removing item ==> ', items)
items.splice(0 /*index to be removed*/, 1/*no. of items to be removed*/)
console.log('after removing item ==> ', items)
If you want to always take out the first element and update the array the use the following code.
var arr =[{"id":"1234","time":"3"}]
arr.reverse().pop()
If you want to get a subset of the array you can slice the array but it will not update the array but create a new array.
arr.slice(STARTING_ADDRESS,NO_OF_ELEMENTS_TO_SLICE)
NOTE: This will return a new array, So if you want to update the old array then you need to assign it to the old array.
arr = arr.slice(STARTING_ADDRESS,NO_OF_ELEMENTS_TO_SLICE)
I am trying to make jQuery update the values in the selector after they are passed. What I mean is this.
I am passing the selector like this.
var items = ['.item-1','.item-2'...];
$(items[1]).click(function(){....});
And then in the end of the function I change the order of the items array.
var items = ['.item-1','.item-2'...];
$(items[1]).click(function(){
// ... function
items = ['.item-3', '.item-1' ...];
});
Now the problem is that the function is binded to the inital items[1], so my changing of the array does not really matter. I am pretty sure there should be a not too complicated solution, so can you please point me in the right direction ?
You could one method in combination with a recursion schema
var items = ['.item-1','.item-2','.item-3'];
$(items[1]).one('click', clickHandler);
function clickHandler() {
items = //re-sort items;
$(items[1]).one('click', clickHandler);
}
Take into account that arrays index is zero based so you're using the second item and not the first when doing items[1].
I think you have to use a recursive method.
It could be:
var items = ['.item-1','.item-2'];
function redefine(){
$(items[1]).click(function(){
items = ['.item-3', '.item-1'];
$(this).unbind("click");
redefine();
});
}
redefine()
Hey guys need a bit of help here.
I'm trying to find all class names that start with the same naming convention in the DOM and put them all in to an array.
so for example.
<div class="userName_342">John</div>
<div class="userName_366">Doe</div>
<div class="userName_234">Bob</div>
<div class="userName_873">David</div>
I need help making the above code with a little bit of JavaScript to the array below.
var classArr = ["userName_342","userName_366","userName_234","userName_873"];
Any help on how to even get started would be greatly appreciated.
Thank you.
Assuming the relevant class is always the only class on those elements, you can do it with an "attribute starts with" selector combined with Array#map:
var list = document.querySelectorAll("div[class^=userName_]");
var classArr = Array.prototype.map.call(list, function(div) {
return div.className;
});
Matt Burland points out that that will return an array with duplicate entries if there are multiple elements with the same class. Two ways to address that:
Array#reduce, but this use of it isn't very efficient:
var list = document.querySelectorAll("div[class^=userName_]");
var classArr = Array.prototype.reduce.call(list, function(array, div) {
if (array.indexOf(div.className) === -1) {
array.push(div.className);
};
return array;
}, []);
...or using a temporary map:
var list = document.querySelectorAll("div[class^=userName_]");
var map = {};
Array.prototype.forEach.call(list, function(div) {
map[div.className] = true;
});
var classArr = Object.keys(map);
Array#map, Array#reduce, Array#forEach, and Object.keys are all ES5 features, but if you need to support older engines, they can all be shimmed.
querySelectorAll is available on all modern browsers, and IE8.
Here is an example of a function to find based on class name.
http://codepen.io/justindunham/pen/nhJsD
document['getElementsByRegex'] = function(pattern){
var arrElements = []; // to accumulate matching elements
var re = new RegExp(pattern); // the regex to match with
function findRecursively(aNode) { // recursive function to traverse DOM
//console.log(aNode);
if (!aNode)
return;
if (aNode.className !== undefined && aNode.className.search(re) != -1)
arrElements.push(aNode); // FOUND ONE!
for (var idx in aNode.childNodes) // search children...
findRecursively(aNode.childNodes[idx]);
};
findRecursively(document); // initiate recursive matching
return arrElements; // return matching elements
};
Based fully on this answer
Select div using wildcard ID
I'm trying to create an array in Javascript with a size that is equivalent to the number of times a certain class is found in the DOM, and then iterate through it to grab the text from an input field present in that class. I can easily do this like so:
var count = 0;
$('.className').each(function() {
count++;
});
var classes = new Array(count);
count = 0;
$('.className input[type=text]').each(function() {
classes[count++] = $(this).val();
});
This looks like a lot of code for what seems to be a relatively simple task. Is there a more efficient or less lengthy way of doing this?
Thanks
It looks like you want this :
var classes = $('.className input[type=text]').map(function(){
return this.value
}).get();
But it's a guess : it's not clear why you start by counting all elements of the class and then iterate on the inputs.
You can construct an array of elements directly from your selector via the makeArray function, then transform the result using a map.
var classes = $.makeArray($('.className input[type=text]')).map(function() {
return $(this).val();
});
Use jQuery's map function, then get if you need a pure array:
var values = $('.className input[type=text]').map(function() {
return $(this).val();
}).get();
each passes the index, so you don't need to do it yourself:
var classes = [];
$('.className input[type=text]').each(function(index, value) {
classes[index] = $(this).val();
});
Arrays are dynamic and therefore don't need to be initialized. Create a new array, loop through the inputs and push the values to the new array:
var classes = [];
$('.className input[type=text]').each(function(idx, elem) {
classes.push($(elem).val());
});