Grace Du

Tesla Interview Candidate

by ritcheyer

HTML

<!-- Without touching the HTML, center .inner in .outer -->
<h1>HTML/CSS Test 1</h1>

<div class="outer">
  <div class="inner"></div>
</div>

<hr>

<!-- Without touching the HTML, follow the directions provided in the <li> elements -->
<h1>HTML/CSS Test 2</h1>

<div>
  <ul>
    <li>Make Me Red!</li>
    <li>I should be black
      <ul>
        <li>I should be black</li>
        <li>I should be black</li>
      </ul>
    </li>
    <li>Make me Green!</li>
  </ul>
</div>

<div>
  <ul>
    <li>I should be black not red!</li>
    <li>I should be black
      <ul>
        <li>I should be black</li>
        <li>I should be black</li>
      </ul>
    </li>
    <li>Make me green!</li>
  </ul>
</div>

<hr>

<h1>HTML/CSS Test 3</h1>

<!-- Please make the phone number bold without touching the DOM and only CSS -->
<h2>Robert Shuka</h2>
<p>Phone: <span>(123) 456-7890</span></p>
<p>Address: <span>123 Some Address, Ames, IA 50010</span></p>

<hr>




<ul id="imgList">
  
  </ul>

CSS

/* HTML/CSS TEST 1 */

.outer{
  width:500px;
  height:500px;
  background:red;
  position:relative;
 
}
.inner {
  width:250px;
  height:250px;
  position:absolute;
  top:0;bottom:0;left:0;right:0;
  background:blue;
margin-top: 125px;
margin-left:125px;  
}
/* HTML/CSS TEST 2 */
ul > li:first-child {
  color:red;
}

div + div ul > li:first-child{
  color:black;
}
/* HTML/CSS TEST 3 */

JavaScript

// JS 1
// In Javascript what’s the difference between these two statements?
// What's the difference?
var x = 3;
x = 3;

// --------------------------------------------------------------------------------

// JS 2
// What is the following block of code doing? How would you re-write it, if at all?
// If you would re-write it, why?
var i_am_getting_old = 11;
var some_ternary_result;
=false;
if (i_am_getting_od>10) {
  some_ternary_result =true;
}
var some_ternary_result = (i_am_getting_old > 10 );

// --------------------------------------------------------------------------------

// JS 3
// How would you optimize the following code snippet?
var urls = ['url1', 'url2', 'url3', 'url10000'];
var newImg='';
var len = urls.length;

for (i = 0; i < len; i++) {
  newImg+ = '<li><img src="' +urls[i] + '"></li>';
 
}
$('#imgList').append(newImg)
// --------------------------------------------------------------------------------