javascript高级程序设计总结之三

最新推荐文章于 2024-09-22 11:17:00 发布

lonpo

最新推荐文章于 2024-09-22 11:17:00 发布

阅读量650

点赞数

分类专栏： web 文章标签： javascript colors safari firefox opera chrome

本文链接：https://blog.csdn.net/jinking_xu/article/details/7051394

版权

web 专栏收录该内容

8 篇文章 0 订阅

订阅专栏

//值=Math.floor(Math.random() * 可能值的总数 + 第一个可能的值
随机选取某一个范围的数值

function selectFrom(lowerValue, upperValue){
var choices = upperValue - lowerValue + 1;
return Math.floor(Math.random() * choices + lowerValue);
}
var num = selectFrom(2, 10);
//alert(num);

//利用这个函数，可以方便地从数组中随机取出一项。
var colors = ["red", "green", "blue", "yellow", "black", "purple", "brown"];
var color = colors[selectFrom(0, colors.length-1)];
alert(color);

innerHTML有限制，通过插入的<script>元素不会被执行。IE是唯一支持这种操作的浏览器，条件是必须指定defer特性，并且在<script>元素前面添加微软所谓的作用域内元素（scoped element）
//在IE中的innerHTML添加<script defer>和<style>元素
//div.innerHTML = "<script defer>alert('hi');</scr"+"ipt>";
//div.innerHTML = "_<script defer>alert('hi');</scr"+"ipt>"; //影响视觉，前面添加了_
//div.innerHTML = "<div> </div><script defer>alert('hi');</scr"+"ipt>";
//div.innerHTML = "<input type=\"hidden\"><script defer>alert('hi');</scr"+"ipt>";
//针对opera、firefox和IE
div.innerHTML = "_<style type=\"text/css\">body{background-color: red;}</style>";
//取得第一个子节点的值由很多种div.childNodes.item(0).data，div.firstChild.nodeValue
//alert(div.childNodes.item(0).data);
//alert(div.firstChild.nodeValue);
//alert(div.childNodes[0].nodeValue);
div.removeChild(div.firstChild);

//针对safari和chrome
document.getElementsByTagName("head")[0].appendChild(div.firstChild);

并不是所有的元素都支持innerHTML属性，
不支持innerHTML的元素有：col、colgroup、frameset、head、html、style、table、tbody、thead、tfoot、titile、tr

访问元素的样式：
cssFloat （firefox、safari、opera、chrome）

styleFloat （IE）

window对象控制源码：

<html>
	<head>
		<title>
			window example
		</title>
	</head>
	<body>
		<script type="text/javascript">
			//跨浏览器取得窗口左边和上边的位置
			var leftPos = (typeof window.screenLeft == "number")? window.screenLeft : window.screenX;
			var topPos = (typeof window.screenTop == "number")? window.screenTop : window.screenY;
			//alert("leftPos:" + leftPos + ",topPos:" + topPos);
			//将窗口移动到屏幕上角
			//window.moveTo(0,0);
			//window.moveBy(200,200);
			
			//取得页面可视窗口的大小,这里主要是考虑的IE6是否为标准模式（CSS1Compat）还是混合模式BackCompat
			var pageWidth = window.innerWidth;
			var pageHeight = window.innerHeight;
			if( typeof pageWidth != "number"){
				if(document.compatMode == "CSS1Compat"){
					pageWidth = document.documentElement.clientWidth;
					pageHeight = document.documentElement.clientHeight;
				}else{
					pageWidth = document.body.clientWidth;
					pageHeight = document.body.clientHeight;
				}
			}
			
			var o = { color: "blue"};
			var name = "color";
			//可以使用o[name]和o.color来访问属性，但是o[name]可能使用的用处更大，可以定义字符串name=color，或者o["color"]
			//alert(o[name]);
			//alert(o.color);
			/*
			 查询location.search的字符串匹配
			function getQueryStringArgs(){
				var qs = location.search.length > 0 ? location.search.substring(1) : "";
				
				var args = {};
				var items = qs.split("&");
				var item = null,
					name = null,
					value =null;
				for(var i = 0; i < items.length; i++){
					item = item.split("=");
					name = decodeURIComponent(item[0]);
					value = decodeURIComponent(item[1]);
					args[name] = value;
				}
				return args;	
			}
			
			var args = getQueryStringArgs();
			//alert(args["q"]);
			//alert(args["num"]);
			*/
			var text = "Windows 95";
			var text1 = "Win98";
			var pattern = /Win(?:dows )?([^do]{2})/;
			if(pattern.test(text1)){
				alert(RegExp["$1"]);
			}
			
		</script>
	</body>
</html>