Javascript code in HTML

Question

I have created a script to random the size but i am unable to figure about how can i use it with HTML or Iframe code to randomize it.

<script type="text/javascript">

    var banner1 = ["728", "90"];
    var banner2 = ["336", "280"];
    var banner3 = ["300", "250"];

    var allbanner = [banner1, banner2, banner3];

    var banner = allbanner[Math.floor(Math.random() * allbanner.length)];

</script>

HTML CODE :

<div style="height:"banner[0]"px;width:"banner[1]"px;color:blue;background-color:blue;"></div>

 <iframe src="http://www.example.com" width="banner[0]" height="banner[1]"></iframe>

This is correct format, I know it wrong, can anyone please tell me how can i use Javascript string in HTML Attribute.

Thanks you .

You can't do it directly like that unless you're using some kind of templating engine. Alternatively you can change element attributes from JS. — jonrsharpe
– jonrsharpe, Commented Apr 22, 2016 at 18:45
Can you please tell me how it possible, I am really week in coding. Or it possible to have iframe with javascript so it accept javascript string. — Maurya Ashish
– Maurya Ashish, Commented Apr 22, 2016 at 18:49
If you're weak in coding, start running through some tutorials. JQuery might be a sensible start if you want to do a lot of DOM updates from JS. — jonrsharpe
– jonrsharpe, Commented Apr 22, 2016 at 18:51

Nathan K · Accepted Answer · 2016-04-22 18:56:57Z

4

You can't mix and match HTML and JavaScript like you're attempting to do. You must modify the DOM from the script.

var banner1 = ["728", "90"];
var banner2 = ["336", "280"];
var banner3 = ["300", "250"];

var allbanner = [banner1, banner2, banner3];

var banner = allbanner[Math.floor(Math.random() * allbanner.length)];

var myDiv = document.getElementById('myDiv');
var myIframe = document.getElementById('myIframe');

myDiv.style.height = banner[0] + 'px';
myDiv.style.width = banner[1] + 'px';

myIframe.style.height = banner[0] + 'px';
myIframe.style.width = banner[1] + 'px';

Assuming your HTML is something like:

<div id="myDiv" style="color:blue;background-color:blue;"></div>
<iframe id="myIframe" src="www.othersite.com"></iframe>

edited Apr 22, 2016 at 18:56

answered Apr 22, 2016 at 18:49

Nathan K

2261 silver badge5 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Maurya Ashish Over a year ago

Thanks Buddy, How can i do it with iframe. I understanding.

Nathan K Over a year ago

@MauryaAshish do what with an iframe? Modify the attributes of the iframe? In that case the process is exactly the same. If you need help with DOM manipulation in JavaScript I'd look for a beginner's tutorial.

Collectives™ on Stack Overflow

Javascript code in HTML

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related