JS添加input,select標簽、設置標簽值,獲取標簽內容


<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>JS添加input,select標簽、設置標簽值,獲取標簽內容</title>
</head>
<body>
<div id="board"></div>
<div class="TestText" id="i-TestText">這是一段測試文本</div>
</body>
</html>
<script type="text/javascript">
var board = document.getElementById("board");
var addTagInput = document.createElement("input");//創建標簽
addTagInput.type = "button";//設置類型
addTagInput.value = "JS添加標簽";//設置值
addTagInput.onclick = displayresult;//綁定函數 觸發 每次都執行
//s.onclick = displayresult();//綁定函數 加載觸發 加載第一次執行
var addresult = board.appendChild(addTagInput);//添加標簽

var addTagSelect = document.createElement("select");
addTagSelect.id = "selVal";
addTagSelect.name = "selValName";
addTagSelect.options[0] = new Option("value1", "1");
addTagSelect.options[1] = new Option("value2", "2", true, true);//Option([文本],[值],[是否默認值],[是否選中])
addresult = board.appendChild(addTagSelect);

//獲取標簽內容
var textTextVal = document.getElementById("i-TestText").innerText;//查找ID為i-TestText 的標簽 內容
textTextVal = document.getElementsByClassName("TestText")[0].innerText;//查找class為TestText 的第一個標簽 內容
// alert(textTextVal); //彈出
console.log(textTextVal);//控制台打印值

//判斷 select 選中值 選擇的是否 默認(defaultSelected)值
function displayresult() {
var x = document.getElementsByTagName("select")[0].selectedIndex;//獲取第一個select標簽選中狀態的索引
var y = document.getElementsByTagName("select")[0].options;//獲取第一個select標簽的選項數組
// alert(y[x].defaultSelected);
console.log(y[x].defaultSelected);//控制台打印值
}
</script>


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM