質問編集履歴

2 質問文の修正

newyee

newyee score 155

2018/09/18 17:17  投稿
document.getElementById()の返り値について
以下のコードについて、分からない部分があり、お聞きしたいです。
```html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>JavaScript本格入門</title>
</head>
<body>
<form>
 <div>
   <label for="name">サイト名：</label><br />
   <input id="name" name="name" type="text" size="30" />
 </div>
 <div>
   <label for="url">URL：</label><br />
   <input id="url" name="url" type="url" size="50" />
 </div>
 <div>
   <input id="btn" type="button" value="追加" />
 </div>
</form>
<div id="list"></div>
<script src="append_child.js"></script>
</body>
</html>
```
```javascript
document.addEventListener('DOMContentLoaded', function() {
 document.getElementById('btn').addEventListener('click', function() {
   var name = document.getElementById('name');
   var url = document.getElementById('url');
   console.log(url);
   var anchor = document.createElement('a');
   
   
   anchor.href= url.value;
   
   
   var text = document.createTextNode(name.value);
   anchor.appendChild(text);
   var br = document.createElement('br');
   var list = document.getElementById('list');
   list.appendChild(anchor);
   // list.insertBefore(anchor, null);
   list.appendChild(br);
 }, false);
}, false);
```
javasciptの方のコード内なのですが、「anchor.href = value」「var text = document.createTextNode(name,value);」ここの２つの部分における、「value」はなんなのでしょうか？
javasciptの方のコード内なのですが、「anchor.href = url.value」「var text = document.createTextNode(name.value);」ここの２つの部分における、「value」はなんなのでしょうか？
以下、上記コードの２つの行では、返り値として、Elementオブジェクトが返っていると思うのですが、Elementオブジェクトのvalueプロパティということなのでしょうか？
「var name = document.getElementById('name');」 「var url = document.getElementById('url');」
  • JavaScript

    27834 questions

    JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。
1 タイトル、文法の修正

newyee

newyee score 155

2018/09/18 17:01  投稿
document.ElementById()の返り値について
document.getElementById()の返り値について
以下のコードについて、分からない部分があり、お聞きしたいです。
```html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>JavaScript本格入門</title>
</head>
<body>
<form>
 <div>
   <label for="name">サイト名：</label><br />
   <input id="name" name="name" type="text" size="30" />
 </div>
 <div>
   <label for="url">URL：</label><br />
   <input id="url" name="url" type="url" size="50" />
 </div>
 <div>
   <input id="btn" type="button" value="追加" />
 </div>
</form>
<div id="list"></div>
<script src="append_child.js"></script>
</body>
</html>
```
```javascript
document.addEventListener('DOMContentLoaded', function() {
 document.getElementById('btn').addEventListener('click', function() {
   var name = document.getElementById('name');
   var url = document.getElementById('url');
   console.log(url);
   var anchor = document.createElement('a');
   
   
   anchor.href= url.value;
   
   
   var text = document.createTextNode(name.value);
   anchor.appendChild(text);
   var br = document.createElement('br');
   var list = document.getElementById('list');
   list.appendChild(anchor);
   // list.insertBefore(anchor, null);
   list.appendChild(br);
 }, false);
}, false);
```
javasciptの方のコード内なのですが、「anchor.href = value」「var text = document.createTextNode(name,value);」ここの２つの部分における、「value」はなんなのでしょうか？
「var name = document.getElementById('name');」 「var url = document.getElementById('url');」
  • JavaScript

    27834 questions

    JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

思考するエンジニアのためのQ&Aサイト「teratail」について詳しく知る