In JavaScript: Add a button labeled Change List Type. When this button is clicke
ID: 3844962 • Letter: I
Question
In JavaScript: Add a button labeled Change List Type. When this button is clicked the list's type attribute is set to the value entered by the user in the text box. Legal values are 1, A, a, I, i. (setAttribute).
type="1"
Items will be numbered with numbers (default)
type="A"
Items will be numbered with uppercase letters
type="a"
Items will be numbered with lowercase letters
type="I"
Items will be numbered with uppercase roman numbers
type="i"
Items will be numbered with lowercase roman numbers
My code so far:
var main = function () {
if (this.id == "btn1"){
var ol = document.createElement("ol");
var div = document.querySelector("div");
div.appendChild(ol);
}
else if (this.id == "btn2"){
var li = document.createElement("li");
li.textContent = String(document.querySelector("input").value);
var ol = document.querySelector("ol");
ol.appendChild(li);
}
}
window.onload = function () {
var buttons = document.querySelectorAll("button");
for (var i = 0; i < buttons.length; ++i)
buttons[i].addEventListener("click", main);
}
Explanation / Answer
<!--for getting the values from the txt box on button click, use the below code.-->
<!DOCTYPE html>
<html>
<body>
<input id="myInput" type="text">
<button>button</button>
<!--for changing the list type attribute use the below code.-->
<script>
function myFunction() {
var text;
var val = document.getElementById("myInput").value;
document.write("<ol type="+val+"><li>123</li><li>456</li></ol>");
<!--I have given only two list item, you can provide any number of list or if you want to use unknow list use function to generate-->
}
</script>
</body>
</html>
<!--PLEASE LIKE AND COMMENT IF YOU SATISFIED WITH THE ANSWER-->
Related Questions
drjack9650@gmail.com
Navigate
Integrity-first tutoring: explanations and feedback only — we do not complete graded work. Learn more.