Javascript to generate new XHTML content not working
Question
I've been scratching at my head with this for a few days now and I cannot find any solution to this online or even with a professor.
I'm working on a system that requires some pages to be capable of dynamically generating new HTML content whilst running (JSF web project running on glassfish4 server) I've found some resources on how to do this but it only worked when running on a standard HTML page. When I convert it to the XHTML standard the function no longer generates anything (although it is still being called, the alert box confirmed that).
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html">
<head>
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=ISO-8859-1"></meta>
<title>Insert title here</title>
</head>
<body>
<SCRIPT type="text/javascript">
function addQuestion() {
alert('yay');
var exam = document.getElementById('divarea');
var temp = document.createElementNS('h', 'button');
temp.setAttribute('value', 'child');
exam.appendChild(temp);
}
</SCRIPT>
<div id="divarea">
</div>
<h:commandButton value="create new stuff" onclick="addQuestion()"/>
</body>
</html>
If anyone can shed some light on this issue it'd be greatly appreciated.
PS Here are the resources I've been using to attempt troubleshooting.
1 answers
solution1
0 2014-01-08 11:28:27
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html">
<head>
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=ISO-8859-1"></meta>
<title>Insert title here</title>
</head>
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<body>
<SCRIPT type="text/javascript">
function addQuestion() {
var oldcon=$("#divarea").html();
var newcon='<button>child</button>';
var updcon=oldcon+newcon
console.log(newcon);
$("#divarea").html(updcon);
}
</SCRIPT>
<div id="divarea">
</div>
<button onclick="addQuestion()"/>dff</button>
</body>
</html>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.