31:T5bd,md` [#](https://github.com/d3/d3-selection/blob/v1.4.1/README.md#selection_enter) *selection*.**enter**() [<>](https://github.com/d3/d3-selection/blob/master/src/selection/enter.js) Returns the enter selection: placeholder nodes for each datum that had no corresponding DOM element in the selection. (The enter selection is empty for selections not returned by [*selection*.data](https://github.com/d3/d3-selection/blob/v1.4.1/README.md#selection_data).) The enter selection is typically used to create “missing” elements corresponding to new data. For example, to create DIV elements from an array of numbers: \`\`\`js const div = d3.select("body") .selectAll("div") .data([4, 8, 15, 16, 23, 42]) .enter().append("div") .text(d => d); \`\`\` If the body is initially empty, the above code will create six new DIV elements, append them to the body in-order, and assign their text content as the associated (string-coerced) number: \`\`\`html

\`\`\` Conceptually, the enter selection’s placeholders are pointers to the parent element (in this example, the document body). The enter selection is typically only used transiently to append elements, and is often [merged](https://github.com/d3/d3-selection/blob/v1.4.1/README.md#selection_merge) with the update selection after appending, such that modifications can be applied to both entering and updating elements. `32:[] 2f:{"title":"d3.selection.enter","cells":[{"id":0,"value":"md`# d3.selection.enter`","pinned":false,"hidden":false,"mode":"ojs"},{"id":8,"value":"{\n const body = html`

`\n d3.select(body)\n .selectAll(\"div\")\n .data([4, 8, 15, 16, 23, 42])\n .enter().append(\"div\")\n .text(d => d);\n return body; // opt+cmd+j to see the element view\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":13,"value":"data_elems = {\n const body = html`

`\n const data_elems = d3.select(body)\n .selectAll(\"div\")\n .data([4, 8, 15, 16, 23, 42])\n return data_elems\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":36,"value":"data_elems.data() // this is the update selection which is empty at the moment","pinned":true,"hidden":false,"mode":"ojs"},{"id":40,"value":"data_elems.enter() // this is the enter selection","pinned":true,"hidden":false,"mode":"ojs"},{"id":19,"value":"enter_selection = {\n const body = html`

`\n const data_enter = d3.select(body)\n .selectAll(\"div\")\n .data([4, 8, 15, 16, 23, 42])\n .enter() // return the enter selection\n return data_enter\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":23,"value":"enter_selection_append_div = {\n const body = html`

`\n const data_enter_append_div = d3.select(body)\n .selectAll(\"div\")\n .data([4, 8, 15, 16, 23, 42])\n .enter()\n .append(\"div\")\n return data_enter_append_div\n // return body // but won't display the text\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":28,"value":"data_enter_append_div_text = {\n const body = html`

`\n const data_enter_append_div_text = d3.select(body)\n .selectAll(\"div\")\n .data([4, 8, 15, 16, 23, 42])\n .enter()\n .append(\"div\")\n .text(d => d);\n return data_enter_append_div_text\n // return body // will display the text \n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":5,"value":"$31","pinned":false,"hidden":false,"mode":"ojs"},{"id":9,"value":"import {d3} from \"@embracelife/tutorial-utilities\"","pinned":true,"hidden":false,"mode":"ojs"}],"files":"$W32","stdlib":"1","titling":"auto"}