By the way, this assumes you’re programmatically creating the content shown in your UIWebView, so this solution wouldn’t work if you’re accessing external web sites. But if you’re doing that, they’ll probably be referencing external CSS and JS anyway. Also, my app doesn’t need to display images in the UIWebView, so I haven’t looked into a solution for displaying local images.
As of iOS 3.0, it appears that a UIWebView can no longer access local files directly. But you can get around this by reading in the contents of the files and then writing them into the HTML of the page you’re going to display. This means you can still store the CSS and JS in their own files, which is much better for readability.
Here’s the code snippet to pull it in: (you may need to copy-paste to see it all)
// load css styles NSString *cssPath = [[NSBundle mainBundle] pathForResource:@"MyCSS" ofType:@"css"]; NSData *cssData = [NSData dataWithContentsOfFile:cssPath]; NSString *cssString = [[NSString alloc] initWithData:cssData encoding:NSASCIIStringEncoding]; // load js NSString *jsPath = [[NSBundle mainBundle] pathForResource:@"MyJS" ofType:@"js"]; NSData *jsData = [NSData dataWithContentsOfFile:jsPath]; NSString *jsString = [[NSString alloc] initWithData:jsData encoding:NSASCIIStringEncoding]; // compose full html page NSString *pageContent = [NSString stringWithFormat:@"%@%@%@", cssString, jsString, actualPageMarkup];
If you try this, the page should display with your CSS, but the JS won’t work. Why? Because, by default Xcode 3.2 thinks your JS files should be compiled, and it doesn’t know how to do it. Instead, what you want is for Xcode to just include the JS files in your bundle, just like it does with the CSS files. To do this, go under Targets in your left-hand “Groups & Files” sidebar, then under your app, then under “Compile Sources.” You should find all your JS files under there. Drag them under “Copy Bundle Resources” instead, rebuild, and the JS should run just fine.