My get element by ID is not working - javascript

There is something wrong with this code.
HTML
<p id = "Krishna"></p>
JavaScript
document.getElementById("Krishna").innerHTML = "Hello"

You are not calling your script in the code above. I use the same code with a function:
<script>
function fun(){
document.getElementById("Krishna").innerHTML = "Hello";
}
</script>
</head>
<body onload='fun()'>
<p id = "Krishna"></p>
</body>
I hope it works for you.

Related

Button don't executes JS

I'm interested on learn about the programming world and I'm trying some basics about making simple web plugins. The thing is I'm not able to make my button run a little JS, any tip? Thanks a lot!!
<button id="button1" onclick="myFunction()">Start the script</button>
<script type="application/javascript">
document.addEventListener("button1", myFunction);
function myFunction() {
var para = document.createElement("p");
var ht1 = '<p class="pop">Working</p>';
var ht2 = '<p class="image"><img src="image.png"></p>';
};
</script>
First of all if you want that something would happen you need to write that in the function. You already wrote variables, but you did nothing with them, so nothing could happen.
Try this :
<p id="demo" onclick="myFunction()">Click me to change my HTML content (innerHTML).</p>
<script>
function myFunction() {
document.getElementById("demo").innerHTML = "Paragraph changed!";
}
</script>

Set value element to a other page called by window.open()

I'm struggling to implement this case, I really appreciate your help.
UPDATE :
page1.html
<html>
<head>
<title></title>
</head>
<body >
<form>
filled value : <input type="text" id="one">
</form>
</body>
</html>
page2.html
<form>
<input type="button" onclick='go();' value='call_page1'/>
</form>
First attempt : page1 shows up, but value is not set
<script>
function go(){
var newWindow;
newWindow= window.open('page1.html', 'form', 'width=400,height=350');
newWindow.document.getElemetById('one').value='xxx';
}
</script>
Second attempt : page1 is not even shown up
<script>
function go(){
var detailsWindow;
detailsWindow = window.open('page1.html', 'form', 'width=400,height=350');
detailsWindow.onload = function{
document.getElementById('one').value='test';
}
}
<script>
Question : setting value' value to page1.html, when it's called in page2.html?
Or if there's an alternative (but please take it easy on me, i'm just learning this stuff ). I don't use JQuery, if there's something unclear, i'm happy to hear it.
regard.
// page1.html
<script>
var newWindow = window.open('page2.html', 'formUntukUpdate', 'width=400,height=350');
newWindow.onload = function(){
newWindow.document.getElementById('one').value = 'ok 2';
};
</script>
// page2.html
<input type="text" id="one" value="ok" />
First of all javascript is case sensetive, and n is missing. so replace getElemetByID with getElementById.
Second is that the code executes immediately and doesn't wait the page to load. You must wrap your code in window.onload :
newWindow.onload = function(){
newWindow.document.getElementById('one').value='xxx';
}
there's 3 bugs in the update:
function in detailsWindow.onload = function must be declared with detailsWindow.onload = function() to work.
your end script is must be replaced from <script> to </script>
you are missing detailsWindow in document.getElementById('one').value = 'test'; it must be detailsWindow.document.getElementById('one').value = 'test';

how to echo javascript generated value in href?

This is my javascript code below (Just to get current url)
<html>
<head>
</head>
<body onload="myFunction();">
<p id="myurl"></p>
<script>
function myFunction() {
document.getElementById("myurl").innerHTML =
window.location.host;
}
</script>
</body>
</html>
And Now i want to use <p id="myurl"></p> as below:
</p>">Share on Facebook <br>
But as it cant be execured inside href="value"
Is there any way to do that with php or something else?
Use this :-
Share on Facebook <br>
With pure javascript (default url in href):
<a id="share_url" href="https://www.facebook.com/sharer/sharer.php?u=">Share on Facebook</a>
<script>
function myFunction() {
var el = document.getElementById("share_url");
el.href += window.location.host;
}
</script>
Demo: http://jsfiddle.net/Lrkjr23o/1/
Other way to create href attribute dynamically:
<a id="share_url">Share on Facebook</a>
<script>
function myFunction() {
var el = document.getElementById("share_url");
el.href = 'https://www.facebook.com/sharer/sharer.php?u=';
el.href += window.location.host;
}
</script>
Demo: http://jsfiddle.net/Lrkjr23o/
I'm assuming client only solution is needed here, server can be anything (PHP, ASP, etc.)
All you've to do is to modify the href property of anchor tag. You can modify your code as -
var elm = document.getElementById("demo");
var URLBase = elm.getAttribute("href");
var fullURL = URLBase.window.location.host;
elm.setAttribute("href", fullURL);

Return value from javascript to html

<head>
function productName(name)
{
}
</head>
<body>
<img src="...images/car.jpg" onclick="productName('car')">
</body>
What I should write in this javascript function to print the value received from the onclick method to any public place in my html body?
Say you have an element like this:
<div id="content">
</div>
your js function would be like this:
<script type="text/javascript">
function productName(name)
{
document.getElementById('content').innerHTML = name;
}
</script>
You can create a textNode and append it to the body
function productName(name) {
var t=document.createTextNode(name);
document.body.appendChild(t)
}
Demo: Fiddle
Or in jQuery,
$('#content').html( name); // inner HTML of an element, by ID
$('#inputField').val( name); // into an INPUT.

Variable not sent to other function

I have a number of links, that when clicked on, passes a variable thru to another portion of the page.
Yet, for some reason, I can’t figure it out! What am I missing?
<head>
<script type="text/javascript">
function myFunction(a){
myid="Hi There!"+a;
return myid;
}
</script>
</head>
<body>
Click Me<br />
<script type="text/javascript">
document.write(myid);
</script>
</body>
You are getting a little mixed up here. Even though the function returns a value, it has nothing to return it to. Try this:
<head>
<script type="text/javascript">
function myFunction(a){
myid="Hi There!"+a;
document.getElementById("debug").innerHTML = myid;
}
</script>
</head>
<body>
Click Me<br />
<div id="debug"></div>
</body>
if you want to use it later you need to declare myid as a global variable. its scope is currently only within myFunction. also the document.write() function will only execute at runtime so you need to have another function the executes that with every click, or just combine the two.
When you click the link all that happens is that the myFunction() is called which returns the string. The line document.write(myid); is not executed anymore so nothing is visible.
<script>
// This is global
var myid = ''
myfunc = function(a){
myid = "Hi There!" + a;
alert(myid);
}
test_global = function(){
alert(myid);
}
</script>
Set MYID
<input type="button" onclick="test_global();" value="Test MYID" />
Here is a simple example of some similar stuff:
clickme or ClickMeAlso
<input id='other' type='text'/>
<script>
function myfunc(a) {
return a + " howdy";
};
</script>
You can see this in action here:http://jsfiddle.net/5Sbn2/

Categories

Resources