I have an array with some elements in it.
var arr=["bet-vet","ban-van","baskat-vase"];
While displaying the array, the want the hyphen in between the words to be removed. When it is being displayed,
the user should see
Bet,vet,ban,van,baskat,vase
Here is the link of my code
You ca try:
var arr = ["bet-vet", "ban-van", "baskat-vase"];
arr= arr.join("-").split("-").join();
console.log(arr);
Use Javascript Joint() & Split() method
example:
var arr=["bet-vet","ban-van","baskat-vase"];
var arrJoin = arr.join("-");
var arrsplit = arrJoin.split("-");
console.log(arrsplit);
You can try this
<script>
var b_or_v =["bet-vet","bat-vat","reb-rev","bick-vic","ban-van"];
function removeHyphen()
{
var newArray = [];
for(i=0;i<b_or_v.length;i++)
{
res = b_or_v[i].split("-");
newArray.push(res[0]);
newArray.push(res[1]);
}
console.log(newArray);
document.getElementById("text").innerHTML = newArray;
}
</script>
<body>
<button onclick="removeHyphen()">Find Val</button>
<div id="text">
</div>
</body>
Here is jsFiddle link
Try to use code as mentioned below:
document.getElementById("btn-1").onclick= function(){
document.getElementById("submit").onclick= function(){
var txt = [];
for (var i = 0; i < b_or_v.length; i++) {
if(b_or_v[i].match(/-/g)){
txt += b_or_v[i].split('-');
txt += ', ';
}
else{
txt += b_or_v[i]+', ';
}
}
Output: b_or_v : bet, vet, bat, vat, reb, rev, bick, vic, ban, van,
What about something like this:
var arr = ["bet-vet", "ban-van", "baskat-vase"];
var arr1 = [];
for(var i= 0; i < arr.length;i++){
test= arr[i].replace('-', '');
arr1.push(test);
}
console.log(arr1.join(', '));
Related
I have links on page and want mask them. I want,
that at onLoad all points in urls (which are in href) will be replaced with something like "|",
so instead of
link
there is somehting like
link.
Then, at onClick replacements should be reversed to make links working again.
Need help to get this code to work:
function mask() {
var str = document.getElementByName("a");
var x = str.attributes.href.value.replace('.', '"|"');
document.getElementsByTagName("a").attributes.href.value = x;
}
function unmask(){
var str = document.getElementByName("a");
var x = str.attributes.href.value.replace('"|"', '.');
document.getElementsByTagName("a").attributes.href.value = x;
}
<body onLoad="mask()">
link
</body>
You have to use the getElementsByTagName method:
function mask() {
var a = document.getElementsByTagName('a');
for (var i = 0; i < a.length; i++) {
a[i].attributes.href.value = a[i].attributes.href.value.replace(/\./g, '"|"');
}
}
function unmask() {
var a = document.getElementsByTagName('a');
for (var i = 0; i < a.length; i++) {
a[i].attributes.href.value = a[i].attributes.href.value.replace(/"\|"/g, '.');
}
}
<body onLoad="mask()">
link
</body>
There are several issues in your code:
document.getElementByName("a") is not valid
str.attributes.href.value is not valid
You need to go global replace to replace all the . with | and vice-versa.
function mask() {
var str = document.getElementsByTagName("a")[0];
var x = str.href.replace(/\./g, '"|"');
str.href = x;
}
function unmask(){
var str = document.getElementsByTagName("a")[0];
var x = str.href.value.replace(/"|"/g, '.');
str.href = x;
}
<body onLoad="mask()">
link
</body>
For example I want to collect some tags (lets say paragraph):
var tagsCollection = document.getElementsByTagName('p');
var tagsCollectionLength = tagsCollection.length
I loop through (iterate):
for (var i = 0; i < tagsCollectionLength; i++)
{
//get an array:
var tagsCollectionArray = tagsCollection[i];
}
Now what to do to get all array items as ONE item:
so it won't looks like:
[paragraph1, paragraph2, paragraph3]
but like:
[paragraph1paragraph2paragraph3]
I did try join. concat. etc. without success probably I'm doing something wrong, any help is appreciated. Thanks.
you can keep a variable outside the for, append the strings inside for and when for finishes, push it inside an array.
Here's how to do that -
var tagsCollection = document.getElementsByTagName('p');
var tagsCollectionLength = tagsCollection.length;
var tags = "", tagsCollectionArray = [];
for (var i = 0; i < tagsCollectionLength; i++)
{
tags = tags + tagsCollection[i];
}
tagsCollectionArray.push(tags);
Suppose you have this html
<div>
<p>a</p>
<p>b</p>
<p>c</p>
<p>d</p>
<p>e</p>
</div>
Assuming the result you want is an Array of all the paragraphs's content ([paragraph1paragraph2paragraph3]), then you could do the following:
tagsCollection = document.getElementsByTagName('p');
var ar = [];
for(var i = 0; i < tagsCollection.length; i++ ) {
ar.push(tagsCollection[i].innerText)
}
console.log([ar.join('')]) // => ["abcde"]
See this fiddle
As I have already commented, you can use Array.join("").
JSFiddle.
(function() {
var data = [];
var str = [].map.call(document.getElementsByTagName('p'), function(item) {
return item.innerHTML;
}).join("");
data.push(str);
document.write("<pre>" + JSON.stringify(data) + "</pre>");
})()
<p>hello</p>
<p>workd</p>
<p>test</p>
This is a code, ive used to maximize 5 words in each title
<script>
jQuery(document).ready(function() {
var limitWord = jQuery(".description").html();
limitWord.val(limitWord.val().substr(0, 5));
});
</script>
You can use the split function,
I have created a simple jsFiddle however it can be improvemed :)
jsFiddle : https://jsfiddle.net/nbj8ch45/
html
<div class="title">
this is a title with many different words
</div>
jquery
$(function()
{
var text = $('.title').text();
var words = text.split(' ');
$('.title').text(words[0]+' '+words[1]+' '+words[2]+' '+words[3]+' '+words[4]);
});
Here you are your example working
http://jsfiddle.net/2ad3cb3p/5/
var limit = 5;
$(document).ready(function() {
var descs = $(".description");
descs.each(function() {
var txt = $(this).html().split(" ");
var newTxt = '';
for(var i = 0; i < limit ; i++) {
newTxt += txt[i] + " ";
}
$(this).html(newTxt);
});
});
this might help you
jQuery(document).ready(function() {
var limitWord = jQuery(".description").html();
limitedWord = getWords(limitedWord);
});
function getWords(str) {
return str.split(/\s+/).slice(1,6).join(" ");
}
You must use split() function
<script>
jQuery(document).ready(function() {
var limitWord = jQuery(".description").html();
var res = str.split(" ");
});
</script>
In res[0] to res [4], you have the 5 words, see in:
http://www.w3schools.com/jsref/jsref_split.asp
<script>
jQuery(document).ready(function() {
var limitWord = jQuery(".description").html();
limitWord.val(limitWord.val().split(' ').slice(0, 5).join(' '));
});
you can try this
this should work:
<script>
jQuery(document).ready(function() {
var limitWord = jQuery(".description").html();
var arr = limitWord.split(' ')
var str = "";
for(var i=0; i<arr.length && i<5; i++){
str += arr[i] + " ";
}
jQuery(".description").html(str)
});
</script>
heres a fiddle: http://jsfiddle.net/shLyLc0k/
If I have webpage with for example alot of <td class="house">111 22</td>. The numbers are random but classname is the same and the blankspace between the numbers are at same position in all of them, and I want to remove the space in all of them after page is loaded. How should the script look like to work?
How about using this
var str = "111 22";
str = str.replace(" ","");
code example :
<script type="text/javascript">
//Page Initial
$(function() {
removeSpace();
});
function removeSpace(){
var str = $(".house").html();
str = str.replace(" ","");
$(".house").html(str);
}
</script>
Do this:
var elems = document.querySelectorAll('td.house');
for(var i = 0 ; i < elems.length; i++){
elems[i].textContent = elems[i].textContent.replace(" ","");
}
use the following code:
<script type="text/javascript">
window.onload = removeSpace;
function removeSpace() {
var emt = document.getElementById("mytable");//mytable is the Id of the table
d = emt.getElementsByTagName("tr")[0],
r = d.getElementsByTagName("td");
for (var i = 0; i < r.length; i++) {
var str = r[i].innerText;
r[i].innerText = str.replace(" ", "");
}
}
</script>
I have a text array. I want to display the first entry on page load. And then replace the text with the next entry when I click a button. If I keep clicking the button I want the text to continuously be replaced by waht is next in the array, and when it gets to the end start back at the first entry. Can someone please show me an example code for that. I am new to this.
Here's what I have
$(document).ready(function(){
var arr = new Array("One","Two","Three");
var len=arr.length;
$('#next').click(function(){
for(var i=0; i<len; i++) {
$('#quote').html(arr[i]);
}
});
});
Something like the following should do the trick:
<script type="text/javascript">
var nextWord = (function() {
var wordArray = ['fe','fi','fo','fum'];
var count = -1;
return function() {
return wordArray[++count % wordArray.length];
}
}());
</script>
<p id="foo"> </p>
<button onclick="
document.getElementById('foo').innerHTML = nextWord();
">Update</button>
Edit
Radomised version:
var nextWord = (function() {
var wordArray = ['fe','fi','fo','fum'];
var copy;
return function() {
if (!copy || !copy.length) copy = wordArray.slice();
return copy.splice(Math.random() * copy.length | 0, 1);
}
}());
The following should do it http://jsfiddle.net/mendesjuan/9jERn/1
$(document).ready(function(){
var arr = ["One","Two","Three"];
var index = 0;
$('#next').click(function(){
$('#quote').html(arr[index]);
index = (index + 1) % arr.length ;
});
});
Your code was writing all three values each time you clicked it (but only displaying that last value)
I think something like this would work
The javascript would look like:
// assuming maxTextArrayIndex & textArray are defined & populated
var textDisplayIndex = -1;
document.getElementById('textDisplay').innerHTML = textArray[textDisplayIndex];
function nextElement()
{
textDisplayIndex += 1;
if (textDisplayIndex > maxTextArrayIndex)
{
textDisplayIndex = 0;
}
document.getElementById('textDisplay').innerHTML = textArray[textDisplayIndex];
}
The html would look like:
<body onLoad=nextElement()>
...
<elementToDisplayText id=textDisplay></elementToDisplayText>
<button onClick=nextElement()>Next</button>