1
Visual Studio 2015에서 Cordova 앱을 사용하고 있습니다. 앱 배경색을 빨간색으로 변경하는 간단한 버튼을 추가했습니다. 그러나 위에서 언급 한 오류를주고있다.Uncaught TypeError : null의 'querySelector'속성을 읽을 수 없습니다.
index.html을
<!DOCTYPE html>
<html>
<head>
<!--
Customize the content security policy in the meta tag below as needed. Add 'unsafe-inline' to default-src to enable inline JavaScript.
For details, see http://go.microsoft.com/fwlink/?LinkID=617521
-->
<meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *">
<meta name="format-detection" content="telephone=no">
<meta name="msapplication-tap-highlight" content="no">
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width">
<link rel="stylesheet" type="text/css" href="css/index.css">
<title>WeatherApp</title>
</head>
<body>
<p>Hello World</p>
<input type="button" name="color" value="Change Color" id="color" onclick="changeColor()">
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="scripts/platformOverrides.js"></script>
<script type="text/javascript" src="scripts/index.js"></script>
</body>
</html>
하는 index.js
(function() {
"use strict";
document.addEventListener('deviceready', onDeviceReady.bind(this), false);
function onDeviceReady() {
// Handle the Cordova pause and resume events
document.addEventListener('pause', onPause.bind(this), false);
document.addEventListener('resume', onResume.bind(this), false);
// TODO: Cordova has been loaded. Perform any initialization that requires Cordova here.
var parentElement = document.getElementById('deviceready');
var listeningElement = parentElement.querySelector('.listening');
var receivedElement = parentElement.querySelector('.received');
listeningElement.setAttribute('style', 'display:none;');
receivedElement.setAttribute('style', 'display:block;');
};
function onPause() {
// TODO: This application has been suspended. Save application state here.
};
function onResume() {
// TODO: This application has been reactivated. Restore application state here.
};
function changeColor() {
var change = document.querySelector('#color');
change.addEventListener('click', change, false);
}
function change() {
var clr = document.querySelector('body');
clr.style.backgroundColor = 'red';
}
})();
DOM로드 순서 문제라고 생각하지 않습니다. 검색된 div가 JS 코드를 편집하지 않고 기본 Cordova HTML 색인 페이지에서 제거 된 것보다 더 많은 것 같습니다. –
고마워요. 오류가 제거되었지만 버튼이 여전히 작동하지 않습니다. 버튼이 배경이나 본문의 색상을 변경하지 않습니다. – honey