一塘幅、webView調(diào)用js代碼并向JS內(nèi)傳值
方法一 webView 執(zhí)行js 函數(shù)
- (void)webViewDidFinishLoad:(UIWebView *)webView{
[webView stringByEvaluatingJavaScriptFromString:@"ocCallJSFunction({'name':'vix'})"];
}
#test.js
function ocCallJSFunction(data) {
var obj = eval(data);
alert(obj.name);
}
方法二 獲取js上下文 執(zhí)行js函數(shù)
- (void)webViewDidFinishLoad:(UIWebView *)webView{
JSContext *context = [webView valueForKeyPath:@"documentView.webView.mainFrame.javaScriptContext"];
[context evaluateScript:@"ocCallJSFunction({'name':'vix'})"];
}
#test.js
function ocCallJSFunction(data) {
var obj = eval(data);
alert(obj.name);
}
方式三 JS調(diào)用原生OC的方法营曼，并傳值
首先xxx.h設(shè)置JSExport協(xié)議
@protocol JSObjDelegate <JSExport>
- (NSString *)sayHello;
@end
在xxx.m中遵守協(xié)議<JSObjDelegate>
- (void)webViewDidFinishLoad:(UIWebView *)webView{
JSContext *context = [webView valueForKeyPath:@"documentView.webView.mainFrame.javaScriptContext"];
//定義好JS要調(diào)用的方法乒验，sayHello就是調(diào)用的方法名
context[@"app"] = self;//遵守協(xié)議 app為js中定義的一個類用來調(diào)用sayHello方法
}
- (NSString *)sayHello {
return "Hello OC";
}
二、js向OC傳值
一蒂阱、截取webView內(nèi)鏈接進(jìn)行傳值
- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType
{
NSString *url = request.URL.absoluteString;
if ([url rangeOfString:@
"[vix://](vix://)"
].location != NSNotFound) {
// url的協(xié)議頭是vix
NSLog(@"===%@", url);//獲取url中攜帶的值
return NO;
}
return YES;
}
二锻全、捕獲JS里面的方法和方法內(nèi)的參數(shù)
- (void)webViewDidFinishLoad:(UIWebView *)webView {
JSContext *context = [webView valueForKeyPath:@"documentView.webView.mainFrame.javaScriptContext"];
//定義好JS要調(diào)用的方法，ocCallJSFunction就是調(diào)用的方法名
context[@"ocCallJSFunction"] = ^{
NSLog(@"+++++++Begin Log+++++++ ");
NSArray *args = [JSContext currentArguments];
for (JSValue *jsVal in args) {
NSLog(@"%@", jsVal.toString);//獲取js內(nèi)參數(shù)值123
}
};
}
#xxx.js
function sayHello(){
// alert("hello");
ocCallJSFunction("123")
}
html录煤、js鳄厌、css代碼
#html代碼
<!DOCTYPE html>
<html>
<head lang="zh">
<meta charset="UTF-8">
<title>第一個HTML</title>
<link rel="stylesheet" type="text/css" href="test.css">
<script type="text/javascript" src="test.js"></script>
</head>
<body>
<h1>我是HTML</h1>
<p id = "p">p標(biāo)簽</p>
<br/><br/><br/>
<button onclick = "sayHello()">點(diǎn)擊我彈出hello</button>
</body>
</html>
#css代碼
#p{
color:red;
}
#img{
width:120px;
height:50px;
}
#a{
color:yellow;
}
#js代碼
function sayHello("123"){
// alert("hello");
ocCallJSFunction("123")
}
//function ocCallJSFunction(data) {
// var obj = eval(data);
// alert(obj.name);
// }
三、獲取頁面內(nèi)的任意標(biāo)簽屬性的值
- (void)webViewDidFinishLoad:(UIWebView *)webView{
NSString *title = [webView stringByEvaluatingJavaScriptFromString:@"document.title"];//獲取當(dāng)前頁面的title
NSString *html = @"document.documentElement.innerHTML";//獲取當(dāng)前網(wǎng)頁的html
NSString *html2 = [webView stringByEvaluatingJavaScriptFromString:@"document.getElementById('creditNum').innerText"];//獲取id為creditNum標(biāo)簽的值
NSString *html3 = [webView stringByEvaluatingJavaScriptFromString:@"document.getElementById('zmScore').value"];//獲取標(biāo)簽為id為zmScore的value
NSString *html2 = [webView stringByEvaluatingJavaScriptFromString:@"document.getElementsByTagName('p')[0].innerText"];//獲取標(biāo)簽第一個p的值
NSString *html2 = [webView stringByEvaluatingJavaScriptFromString:@"document.body.innerText"];//獲取body里面的全部內(nèi)容
}
附html代碼如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>1234</title>
</head>
<style type="text/css">
.issue{
font-family: "微軟雅黑";
font-size: 1.2em;
font-weight: 900;
}
.answer{
font-family: "微軟雅黑";
font-size: 1em;
margin-top:-15px;
}
</style>
<body>
<input type='hidden' id='zmScore' value='719'/><input type='hidden' id='freeDeposit' value='true'/>
<p id="creditNum"> 791 </P>
<p class="issue">Q：什么是騎行券妈踊？</p>
<p class="answer">A：騎行費(fèi)用的電子券了嚎。</p>
<p class="issue">Q：如何獲得騎行券？</p>
<p class="answer">A：關(guān)注運(yùn)營方舉辦的活動廊营。</p>
<p class="issue">Q：如何使用騎行券歪泳？</p>
<p class="answer">A：無需用戶手動選擇。</p>
<p class="issue">Q：一次騎行能有幾張騎行券露筒？</p>
<p class="answer">A：每次騎行結(jié)算只能使用一張騎行券呐伞。</p>
</body>
</html>
持續(xù)更新中 ～ (??)
