javascript - How do I select the first child of a parent element? -


I am trying to choose the first child of a basic element with pure javascript and changing its CSS properties I am I've tried the .firstChild and .childNodes [1] methods but they do not work on this CSS nth-child () selector's But I want to do it with Javascript for better browser support.

Example:

HTML

  & lt; Div class = "daddy" & gt; & Lt; Div class = "child" & gt; I want to choose this child and want to change this css property. & Lt; / Div & gt; & Lt; Div class = "hair" & gt; & Lt; / Div & gt; & Lt; Div class = "hair" & gt; & Lt; / Div & gt; & Lt; Div class = "hair" & gt; & Lt; / Div & gt; & Lt; / Div & gt;   

papa '); Var d = x.firstChild; // and x.childNodes [1] d.style.width = "5em";

CSS

  Father: nth-child (1) {width : 5em; }   

Any help would be appreciated.

For better browsers, click cross-browser as Using the first-child selector, you can be asked to use Pure CSS and this CSS 2.1 , please link this and the table below. View which shows browser support:

table first-child

So a snap with css only :

  .child: first-child {/ * CSS you want here - just focus on visualization and snippets: * / background color: red; White color; }   
  & lt; Div class = "daddy" & gt; & Lt; Div class = "child" & gt; I want to choose this child and want to change this css property. & Lt; / Div & gt; & Lt; Div class = "hair" & gt; Hair 2 & lt; / Div & gt; & Lt; Div class = "hair" & gt; Child 3 & lt; / Div & gt; & Lt; Div class = "hair" & gt; Hair 4 & lt; / Div & gt; & Lt; / Div & gt;      

Comments

Popular posts from this blog

java - ImportError: No module named py4j.java_gateway -

python - Receiving "KeyError" after decoding json result from url -

.net - Creating a new Queue Manager and Queue in Websphere MQ (using C#) -