Can i change HTML structure with javascript? [closed] - javascript

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 5 months ago.
Improve this question
I need to change 2 divs up and down by using javascript dom manipulation, without touching html.
<div class="div1"> this needs to go bottom</div>
<div class="div2"> and this needs to go up</div>
Is it possible to manipulate html structure with js?

You can do like this, swap the elements order in the parent node.
var div1 = document.getElementsByClassName("div1")[0];
var div2 = document.getElementsByClassName("div2")[0];
div2.parentNode.insertBefore(div2, div1);

Related

Get the closest iframe to a parent element [closed]

Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 1 year ago.
Improve this question
i am trying t get the closest iframe element to a parent element so can identify the iframe that i want to stylize with css:
<div class ="accroche">
<iframe></iframe>
<iframe></iframe>
<iframe></iframe>
<iframe></iframe>
</div>
What would be the best technique knowing that the iframes are generated by another tool and there is no way to identify them
Well if I understand your problem it’s the first element of the list so you can do something like that in your css to style it :
.accroche iframe:first-child{ … }

How to make document.querySelector accept div id as parameter? [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 3 years ago.
Improve this question
I have this function:
document.querySelector(".myDivClass");
Which accepts a div css class as parameter. How to make it accept a div id as parameter instead?
document.querySelector("#myDivId");
or
document.getElementById("myDivId");
As you can read there:
CSS Selectors, just replace dot with '#'. If this is your div:
<div id="abc" ></div>
then your selector would be document.querySelector("#abc");

Getting HTML values from a page source using javascript [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 7 years ago.
Improve this question
I am trying to take html source lines from page source using javascript.
In my case the source is
<div id="green" class="orange">
Hello
</div>
<div id="red" class="blue">
Hello
</div>
In the above source, I have to take the id value as output, i.e "green" and "red" and not the text "hello" using Javascript, please help me with it.
You can access via class.
document.querySelector('div.orange').id
You could use jquery:
$('div').attr('id')
After Edit it is working example
To get orang class ID try this
$(".orange").attr('id');
And for Blue class try this one
$(".blue").attr('id');
Example on JSFiddle

Javascript grab div and place it in between different divs [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 8 years ago.
Improve this question
<div id='layer1'></div>
<div id='layer2'></div>
<div id='layer3'></div>
I have 3 divs, I want those div can be draggable and adjust the layer like photoshop changing layers.
ex. When user grab layer1 and place between layer3 & layer2 (mouse up).
Anyone know how to achieve this?
Try using Sortable from jQuery UI.
Basically you need to have a structure like this:
<ul class="sortable-list">
...
<li>...</li>
...
</ul>
And then in your jQuery code, just call:
$('.sortable-list').sortable();

How to display data from database in to a webpage with a scroll bar below [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 8 years ago.
Improve this question
I created a page like this before, but I put the data from the database on a table because it don't have so many columns. But this time, I'm going to need a scroll bar bellow because there are so many columns I need to display. I don't know if I'm going to use CSS here or JavaScript. Please help thanks btw.
Try this:table{width:100%;white-space : nowrap;overflow-x: scroll;} You can set height and width of your choice.
<div style="width=300px;overflow:scroll">
<table></table>
</div>

Categories