JavaScript-如何元素id获取页面元素对象
2021-02-02 10:17
标签：技术 one img text div document HERE hid 输入框 案例1： 案例2： JavaScript-如何元素id获取页面元素对象 标签：技术 one img text div document HERE hid 输入框 原文地址：https://www.cnblogs.com/xingsir/p/12808911.html
1. 通过元素id获取页面元素对象
var d = document.getElementById("id");
2. 获取和修改元素的文本内容
获取：d.innerText 修改： d.innerText="xxx";
3. 获取和修改文本框的内容
获取: i.value 修改： i.value="xxx";
4. 获取和修改元素的html内容
DOCTYPE html>
html>
head>
meta charset="UTF-8">
title>Insert title heretitle>
script type="text/javascript">
function myfn(){
//得到文本框 和 div的元素对象
var i = document.getElementById("i1");
var d1 = document.getElementById("d1");
var d2 = document.getElementById("d2");
//获取和修改元素的文本内容
d1.innerText=‘BBB‘;
//把文本框的文本内容取出给到div
d2.innerText = i.value;
}
script>
head>
body>
input type="button" value="按钮" onclick="myfn()">
input type="text" id="i1" value="AAA">
div id="d1">div>
div id="d2">div>
body>
html>
DOCTYPE html>
html>
head>
meta charset="UTF-8">
title>Insert title heretitle>
script type="text/javascript">
function myfn(){
//获取文本输入框和div的元素对象
var i = document.getElementById("i1");
var d = document.getElementById("d1");
//判断用户输入的内容是否是数
if(isNaN(i.value)){
//如果不是数显示xxx
d.innerText="输入错误，请重新输入！";
}else{
d.innerText = i.value*i.value;
}
}
script>
head>
body>
请输入一个数：input type="text" id="i1">
input type="button" value="平方" onclick="myfn()">
div id="d1">div>
body>
html>
文章标题：JavaScript-如何元素id获取页面元素对象
文章链接：http://soscw.com/index.php/essay/49928.html