Hello I have the following on a page and I would like to pull the value: 36424. the value will change thus Im trying to create a function that will pull it when i call on the function.
<table cellspacing="0" cellpadding="3" rules="cols" border="1"
id="OSDataCount" style="color:Black;background-color:White;border-
color:#999999;border-width:1px;border-style:Solid;border-collapse:collapse;">
<tr style="color:White;background-color:Black;font-weight:bold;">
<th scope="col">COUNT(*)</th>
</tr><tr>
<td>36424</td>
</tr>
</table>
cheers
No need for jQuery:
var table = document.getElementById('OSDataCount');
alert(table.rows[1].children[0].innerHTML); // -> 36424
See example →
Using jQuery:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js" type="text/javascript"></script>
<script type='text/javascript'>
function alertval() {
var htmlval = $('#OSDataCount tr:eq(1)>td:first').html();
var textval = $('#OSDataCount tr:eq(1)>td:first').text();
alert("Val:" + val);
}
</script>
See http://api.jquery.com/text/, http://api.jquery.com/html/
Using raw JavaScript:
function alertval() {
var el = document.getElementById("OSDataCount");
alert("Val:" + el.rows[1].cells[0].innerHTML);
}
Adding a little detail to previous (correct) answers:
<script type="text/javascript">
window.onload = function() {
var table = document.getElementById('OSDataCount');
var number = table.rows[1].cells[0].innerHTML;
alert (number);
}
</script>
var value = document.evaluate('id(OSDataCount)/tr/td', document, null, XPathResult.NUMBER_TYPE);
going off a quick search/reach. Probably won't work, but worth a try.
Related
I am trying to create a web calculator utilizing values of text input as numbers and replacing a label at the bottom with the result. Although the problem I am facing is that the functions are either not being called or some other stuff. I am just starting out on Javascript, if you guys would point the problem out, I'll be much grateful.
<!DOCTYPE html>
<html>
<head>
<title>Calc+</title>
<link rel="stylesheet" href="calculator.css">
</head>
<body>
<header>
<div class="container"><center><p><strong>Tarun's</strong>|Calculator</p>
</center></div>
</header>
<section id="calculator">
<div class="container">
<table id="inputs"><tr>
<td><input type="text" id="firstnumber"></td>
<td><input type="text" id="secondnumber"></td>
</tr>
</table>
<table id="operators" cellpadding="0" cellspacing="7">
<tr>
<td id="plus"><button onClick="addition()">+</button></td>
<td id="minus"><button onClick="difference()">-</button></td>
</tr>
<tr><td id="multiply"><button onClick="multiplication()">*</button></td>
<td id="divide"><button onClick="division()">/</button></td></tr>
<tr>
<td colspan="2"><center><label id="result">result</label></center></td>
</tr>
</table>
</div>
</section>
</body>
</html>
function additon()
{
var a = document.getElementById('firstnumber').value;
var b = document.getElementById('secondnumber').value;
document.getElementById("result") = a + b;
}
function difference()
{
var a = document.getElementById('firstnumber').value;
var b = document.getElementById('secondnumber').value;
document.getElementById("result").innerHTML = a - b;
}
function multiplication()
{
var a = document.getElementById('firstnumber').value;
var b = document.getElementById('secondnumber').value;
document.getElementById("result").innerHTML = a * b;
}
function division()
{
var a = document.getElementById('firstnumber').value;
var b = document.getElementById('secondnumber').value;
document.getElementById("result").innerHTML = a / b;
}
There are four major problems with your code.
First the whole JavaScript code (starting with "function addition()") is not inside a script tag. Currently it just gets interpreted as text, thats the reason why you should see it at the bottom when you load your side. To fix this you have to embed the code inside a script tag. The easiest way to do this is inside the head tag as follows:
<!DOCTYPE html>
<html>
<head>
<title>Calc+</title>
<link rel="stylesheet" href="calculator.css">
<script>
function additon()
//other functions here
</script>
</head>
<body>
Second the addition function does not set the innerHTML. Just set the innerHTML there like you did with the other functions.
Third, if you get the value as you try it, the type is actually a string. If you do string + string, the result is a concatination. So "1" + "1" = "11". To change this, just add a + before the a in the addition case, as follows
document.getElementById("result").innerHTML = +a + b;
(Thanks to Frederik Hansen who pointed that one out in the comments.)
Fourth, the addition function isn't named correctly. You wrote additon but you meant addition.
I have a Javascript and html like below. All I want is to change the values bold areas with the "currMonth" and "currYear" variables' values, to make them dynamic. I appreciate for your help!.
<script type="text/javascript">
$(document).ready(function () {
var date = new Date();
var currMonth = date.getMonth();
var currYear= date.getFullYear();
currMonth +=1;
});
</script>
<html>
...
<table>
<td>...<td>
...
<td align="right" class="arrowIcon">
<img src="images/rightarrow.gif" border="0">
</td>
</table>
...
</html>
Thanks.
Edit: Thanks for the answers guys. All of them working!
You can update href in JavaScript:
$(document).ready(function () {
var date = new Date();
var currMonth = date.getMonth();
var currYear= date.getFullYear();
currMonth +=1;
$('table .arrowIcon>a').each(function(i, el) {
$(el).attr('href', 'index.php?m='+currMonth+'&y='+currYear+'&cat=0')
}
});
In plain javascript, use getElementById() to fetch the anchor node, and setAttribute() to change the link. Example given here. But as you are using jQuery, it's easier to use the .attr() function. Eg:
$('a').attr('href', 'index.php?m=' + currentMonth + '...');
you can get the href of the link and replace the ** ** placeholders with your variables like this:
var href= $('.arrowIcon).find('a').attr('href');
href = href.replace("**8**", currMonth);
href = href.replace("**2015**", currYear);
$('.arrowIcon').find('a').attr('href', href);
so, the other option to make it truly dynamic I would solve like this:
link html:
<img src="images/rightarrow.gif" border="0">
js:
$(document).ready(function () {
var date = new Date();
var currMonth = date.getMonth();
var currYear= date.getFullYear();
currMonth +=1;
var cat= $('.arrowIcon).find('a').data('cat');
$('.arrowIcon')
.find('a')
.attr('href',"index.php?m="+currMonth+"&y="+currYear+"&cat="+cat);
});
Here is a example that do not require jQuery if this is the only thing you are doing with javascript.
First of i moved the script tag to the buttom of the document to make sure that the html structure is created before the javascript is run. This is in general a good idea to not halt the rendering with javascript before the whole document is loaded, so placing the script tags in the bottom is best.
<html>
...
<table>
<td>...<td>
...
<td align="right" class="arrowIcon">
<img src="images/rightarrow.gif" border="0">
</td>
</table>
...
<script type="text/javascript">
var date = new Date();
var currMonth = date.getMonth();
var currYear= date.getFullYear();
currMonth +=1;
var atag = document.querySelector("table td a");
atag.href = 'index.php?m='+currMonth+'&y='+currYear+'&cat=0';
</script>
</html>
I have the code here:
function cbfunca(datas){
var videoRefs = (datas.value.items[0].content);
var frames = 'http://www.youtube
nocookie.com/v/'+videoRefs+'?version=3&hl=en_GB&rel=0\"
type=\"application/x-shockwave-flash\" width=\"560\"
height=\"349\">';
var curtextvals = document.getElementById("pumps");
curtextvals.innerHTML = (frames);
}
Video Should Be Here, If you see this, you did something wrong
_id=f261e19584a4dd5cb0a61386b24e80bf&_render=json&_callback=cbfunca">
the second code here:
function cbfunc(data){
var videoRef = (data.value.items[0].content);
var frame = 'http://www.youtube-
nocookie.com/v/'+videoRef+'?version=3&hl=en_GB&rel=0\" type=\"application/x-shockwave-
flash\" width=\"560\" height=\"349\">';
var curtextval = document.getElementById("pump");
curtextval.innerHTML = (frame);
}
Video Should Be Here, If you see this, you did something wrong
The First one always Doesn't appear? how might i fix this? Sorry the code doesn't seem to come up right here.
Code from your link that works for me (it does show 2 videos on the webpage); after adding a "/v/" on the second iframe url.
<td bgcolor="#FFFFFF" valign="middle" align="center"colspan="2" class="dty"><span class="t">Most Recent Video</span>
<script type="text/javascript">
function cbfunc(data){
var videoRef = (data.value.items[0].content);
var frame = '<iframe class=\"embeddedvideo\" src=\"http://www.youtube-nocookie.com/v/'+videoRef+'?version=3&hl=en_GB&rel=0\" type=\"application/x-shockwave-flash\" width=\"560\" height=\"349\"></iframe>';
var curtextval = document.getElementById("pump");
curtextval.innerHTML = (frame);
}
</script>
<div id="pump">Video Should Be Here, If you see this, you did something wrong</div>
<p>
<script src="http://pipes.yahoo.com/pipes/pipe.run?_id=35717280d4cd32a61acd1a36f09635c5&_render=json&_callback=cbfunc">
</script>
</th>
</tr> <tr>
<td bgcolor="#FFFFFF" valign="middle" align="center"colspan="2" class="dty"><span class="t">Most Recent Minecraft Video</span>
<script type="text/javascript">
function cbfunca(datas){
var videoRefs = (datas.value.items[0].content);
var frames = '<iframe class=\"embeddedvideo\" src=\"http://www.youtube-nocookie.com/v/'+videoRefs+'?version=3&hl=en_GB&rel=0\" type=\"application/x-shockwave-flash\" width=\"560\" height=\"349\"></iframe>';
var curtextvals = document.getElementById("pumps");
curtextvals.innerHTML = (frames);
}
</script>
<div id="pumps">Video Should Be Here, If you see this, you did something wrong</div>
<p>
<script src="http://pipes.yahoo.com/pipes/pipe.run?_id=f261e19584a4dd5cb0a61386b24e80bf&_render=json&_callback=cbfunca">
</script>
I have a table in html, I am using Tangle framework to make the values look dynamic of that table.
What I want is to place a check on a specific <td> if its numeric value ever gets negative, the entire <tr> of that particular <td> should change its background color to Red.
Can this be done using java script or some simple lines of code may solve this problem?
Please help me doing this.
<html>
<head>
<style type="text/css">
td.negative { color : red; }
</style>
<script language="JavaScript" type="text/javascript">
<!--
function MakeNegative() {
TDs = document.getElementsByTagName('td');
for (var i=0; i<TDs.length; i++) {
var temp = TDs[i];
if (temp.firstChild.nodeValue.indexOf('-') == 0) temp.className = "negative";
}
}
//-->
</script>
</head>
<body>
<table id="mytable">
<caption>Some Financial Stuff</caption>
<thead>
<tr><th scope="col">Date</th><th scope="col">Money is good</th></tr>
</thead>
<tbody>
<tr><td>2006-05-01</td><td>19.95</td></tr>
<tr><td>2006-05-02</td><td>-54.54</td></tr>
<tr><td>2006-05-03</td><td>34.45</td></tr>
<tr><td>2006-05-04</td><td>88.00</td></tr>
<tr><td>2006-05-05</td><td>22.43</td></tr>
</tbody>
</table>
<script language="JavaScript" type="text/javascript">
<!--
MakeNegative();
//-->
</script>
</body>
I'd suggest:
var table = document.getElementsByTagName('table')[0],
cells = table.getElementsByTagName('td'),
hasNegative = 'hasNegative',
text = 'textContent' in document ? 'textContent' : 'innerText', num = 0;
for (var i = 0, len = cells.length; i < len; i++) {
num = parseFloat(cells[i][text]);
if (Math.abs(num) !== num) {
cells[i].parentNode.className += ' hasNegative';
}
}
JS Fiddle demo.
The rather bizarre means to determine negativity was a result of my previous, perhaps naive, check failing to differentiate between 0 and -0 (though I'm not quite sure whether negative-zero would pass, or fail, your criteria).
I recently found this piece of javascript for a game that I play which basically makes my life easier in the game by doing some parsing. The script was working great when I first used it but then I stopped using it for a few weeks as I had less time to play the game and therefore use the script. I started again yesterday and suddenly, the script no longer worked and I couldnt parse the info that I needed. It no longer works when I click the submit button after the info is put into the text box.
Could anyone help me in finding out what is wrong and why it wont work anymore?
Here is the script and here it is on a website (incase what I posted below got messed up or whatever: www.cnparser.webs.com
<html>
<head>
<title>Recruitment Parser</title>
<script type="text/javascript">
window.onload = function()
{
var pageSource = document.getElementById('pgsource');
var submitButton = document.getElementById('submit');
var bbcodeBox = document.getElementById('nobb');
var outputArea = document.getElementById('output');
submitButton.onclick = function()
{
var cyberMessageLink = "http:\/\/www.cybernations.net/send_message.asp?Nation_ID=";
var cleanUp = pageSource.value.replace(/[^A-Za-z0-9 >]/g, "");
var rulerNames = cleanUp.match(/titleRuler[A-Za-z0-9_ ]{3,}(?=>)/gi);
var nationID = cleanUp.match(/ageaspNationID[0-9]{3,}/g);
if(bbcodeBox.checked)
{
for(var i=0; i<rulerNames.length; i++)
{
if(i%25==0)
{
outputArea.innerHTML+="[url="+cyberMessageLink+nationID[i].substring(14)+"]"+rulerNames[i].substring(11)+"[/url]" + "<br>";
continue;
}
outputArea.innerHTML+=rulerNames[i].substring(11) + "<br>";
if(i%24==0)outputArea.innerHTML+="<br>";
}
} else {
for(var i=0; i<rulerNames.length; i++)
{
if(i%25==0)outputArea.innerHTML+="<br>";
outputArea.innerHTML+=rulerNames[i].substring(11) + "<br>";
}
}
}
}
</script>
</head>
<body>
<table border="0">
<tr>
<td>
<textarea id="pgsource" cols="80" rows="20"></textarea><br/>
</td>
<td>
<b>Style</b><br>
<input id="nobb" type="checkbox">BBcode</input><br>
</td>
</tr>
</table>
<button id="submit">Submit</button><br><br>
<span id="output"></span>
<!-- --><script type="text/javascript" src="http://static.websimages.com/static/global/js/webs/usersites/escort.js"></script> <script type="text/javascript">if(typeof(urchinTracker)=='function'){_uacct="UA-230305- 2";_udn="none";_uff=false;urchinTracker();}</script></body>
</html>
From the linked site:
If this stops working email: gnomy#hushmail.com
Did you email Gnomy?